@mui/x-virtualizer 0.3.2 → 1.0.0-alpha.0
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 +439 -3
- package/esm/features/virtualization/layout.js +59 -2
- package/esm/features/virtualization/virtualization.js +9 -19
- package/esm/index.js +1 -1
- package/esm/utils/useRefCallback.d.ts +1 -0
- package/esm/utils/useRefCallback.js +21 -0
- package/features/virtualization/layout.js +60 -4
- package/features/virtualization/virtualization.js +11 -21
- package/index.js +1 -1
- package/package.json +4 -4
- package/utils/useRefCallback.d.ts +1 -0
- package/utils/useRefCallback.js +28 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,9 +1,445 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
## 9.0.0-alpha.0
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
_Feb 16, 2026_
|
|
6
|
+
|
|
7
|
+
We'd like to extend a big thank you to the 21 contributors who made this release possible. Here are some highlights ✨:
|
|
8
|
+
|
|
9
|
+
- Add support for virtualized items on `<RichTreeViewPro />`:
|
|
10
|
+
|
|
11
|
+
```tsx
|
|
12
|
+
<RichTreeViewPro items={ITEMS} virtualization itemHeight={48} />
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
- Add Thai (`thTH`) locale on the Data Grid and the Date and Time Pickers (#21116) @siriwatknp
|
|
16
|
+
- Add a new `AdapterDayjsBuddhist` adapter for Date and Time Pickers (#20984) @siriwatknp
|
|
17
|
+
- Add support for virtualization in the rich tree view (#20780) @flaviendelangle
|
|
18
|
+
- Add WebGL renderer to Heatmap (#20756) @bernardobelchior
|
|
19
|
+
|
|
20
|
+
Special thanks go out to these community members for their valuable contributions:
|
|
21
|
+
@jhe-iqbis
|
|
22
|
+
|
|
23
|
+
The following team members contributed to this release:
|
|
24
|
+
@alexfauquette, @arminmeh, @bernardobelchior, @brijeshb42, @cherniavskii, @dav-is, @flaviendelangle, @Janpot, @JCQuintas, @mapache-salvaje, @MBilalShafi, @michelengelen, @mj12albert, @noraleonte, @oliviertassinari, @rita-codes, @romgrk, @sai6855, @siriwatknp
|
|
25
|
+
|
|
26
|
+
### Data Grid
|
|
27
|
+
|
|
28
|
+
#### `@mui/x-data-grid@9.0.0-alpha.0`
|
|
29
|
+
|
|
30
|
+
- [DataGrid] Update default `logicOperator` behavior in filtering docs (#21098) @michelengelen
|
|
31
|
+
- [DataGrid] Add `thTH` locale (#21116) @siriwatknp
|
|
32
|
+
- [DataGrid] Fix initial filter value state in CustomMultiValueOperator demo (#21217) @sai6855
|
|
33
|
+
|
|
34
|
+
#### `@mui/x-data-grid-pro@9.0.0-alpha.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
35
|
+
|
|
36
|
+
Same changes as in `@mui/x-data-grid@9.0.0-alpha.0`, plus:
|
|
37
|
+
|
|
38
|
+
- [DataGridPro] Cleanup outdated rows on `dataSource` reference update (#21138) @MBilalShafi
|
|
39
|
+
|
|
40
|
+
#### `@mui/x-data-grid-premium@9.0.0-alpha.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
41
|
+
|
|
42
|
+
Same changes as in `@mui/x-data-grid-pro@9.0.0-alpha.0`.
|
|
43
|
+
|
|
44
|
+
### Date and Time Pickers
|
|
45
|
+
|
|
46
|
+
#### `@mui/x-date-pickers@9.0.0-alpha.0`
|
|
47
|
+
|
|
48
|
+
- [pickers] Add `AdapterDayjsBuddhist` adapter (#20984) @siriwatknp
|
|
49
|
+
- [pickers] Add `thTH` locale (#21116) @siriwatknp
|
|
50
|
+
|
|
51
|
+
#### `@mui/x-date-pickers-pro@9.0.0-alpha.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
52
|
+
|
|
53
|
+
Same changes as in `@mui/x-date-pickers@9.0.0-alpha.0`.
|
|
54
|
+
|
|
55
|
+
### Charts
|
|
56
|
+
|
|
57
|
+
#### `@mui/x-charts@9.0.0-alpha.0`
|
|
58
|
+
|
|
59
|
+
- [charts] Add Legend actions (#20404) @JCQuintas
|
|
60
|
+
- [charts] Add `Chart` suffix to MUI Classes (#21042) @JCQuintas
|
|
61
|
+
- [charts] Add `axesGap` props to put space between axes (#20904) @alexfauquette
|
|
62
|
+
- [charts] Add `cleanIdentifier` function to charts series instance (#20832) @JCQuintas
|
|
63
|
+
- [charts] Add `initialHiddenItems` prop to set initial state (#20894) @JCQuintas
|
|
64
|
+
- [charts] Add `useXAxisCoordinates` and `useYAxisCoordinates` hooks (#20972) @bernardobelchior
|
|
65
|
+
- [charts] Add axis slots and expose axis ticks hooks (#20935) @bernardobelchior
|
|
66
|
+
- [charts] Change `line` legend marker to be a line (#21059) @JCQuintas
|
|
67
|
+
- [charts] Codemod test pattern with function (#21111) @JCQuintas
|
|
68
|
+
- [charts] Control the item tooltip (#20617) @alexfauquette
|
|
69
|
+
- [charts] Enable keyboard navigation in radar chart (#20765) @alexfauquette
|
|
70
|
+
- [charts] Export `CartesianChartSeriesType` and `StackableChartSeriesType` (#21012) @bernardobelchior
|
|
71
|
+
- [charts] Export plugins from premium (#20866) @JCQuintas
|
|
72
|
+
- [charts] Filter hidden series from axis tooltip (#21273) @Copilot
|
|
73
|
+
- [charts] Filter hidden series from axis tooltip (#21273) @Copilot
|
|
74
|
+
- [charts] Fix rename `getSVGPoint` to `getChartPoint` (#21335) @bernardobelchior
|
|
75
|
+
- [charts] Fix cleanup function in useChartInteractionListener to correctly remove event listeners with options (#21218) @sai6855
|
|
76
|
+
- [charts] Fix import rename in codemod (#21112) @JCQuintas
|
|
77
|
+
- [charts] Fix multiple exports of `HighlightScope` (#21270) @bernardobelchior
|
|
78
|
+
- [charts] Fix test inconsistency in charts (#20907) @JCQuintas
|
|
79
|
+
- [charts] Fix tooltip position for stacked line series (#20901) @alexfauquette
|
|
80
|
+
- [charts] Make Highlight scope a generic (#21189) @alexfauquette
|
|
81
|
+
- [charts] Make `LegendItemParams.type` required (#21003) @alexfauquette
|
|
82
|
+
- [charts] Make `seriesId` a string only (#20997) @alexfauquette
|
|
83
|
+
- [charts] Make the `useChartRootRef` support typing parameter (#21023) @alexfauquette
|
|
84
|
+
- [charts] Memoize HeatmapItem to avoid re-render when fading/highlighting (#20865) @bernardobelchior
|
|
85
|
+
- [charts] Move axis id to `data-axis-id` attribute instead of class (#21037) @JCQuintas
|
|
86
|
+
- [charts] Move `cleanIdentifier` and `serializeIdentifier` instance methods to `useChartSeriesConfig` plugin (#21025) @JCQuintas
|
|
87
|
+
- [charts] Move `seriesConfig` to `useChartSeriesConfig` plugin (#21004) @JCQuintas
|
|
88
|
+
- [charts] Move element refs to `useChartElementRef` plugin (#21099) @JCQuintas
|
|
89
|
+
- [charts] Move types related to `seriesConfig` into the `useChartSeriesConfig` plugin folder (#21026) @JCQuintas
|
|
90
|
+
- [charts] Remove `data-has-focused-item` from `ChartsSurface` (#21255) @bernardobelchior
|
|
91
|
+
- [charts] Remove default generic of item identifiers (#21182) @alexfauquette
|
|
92
|
+
- [charts] Remove deprecated `id` from `LegendItemParams` (#21055) @alexfauquette
|
|
93
|
+
- [charts] Remove deprecated `ChartApi` export from `ChartContainer` (#20975) @JCQuintas
|
|
94
|
+
- [charts] Remove deprecated `useAxisTooltip` in favor of `useAxesTooltip` (#20962) @Copilot
|
|
95
|
+
- [charts] Remove deprecated series type helpers and functions (#20998) @alexfauquette
|
|
96
|
+
- [charts] Rename `ChartContainer` to `ChartsContainer` (#21173) @JCQuintas
|
|
97
|
+
- [charts] Rename `getSVGPoint` to `getChartPoint` (#21322) @bernardobelchior
|
|
98
|
+
- [charts] Rename `TickItemType` to `TickItem` (#21008) @bernardobelchior
|
|
99
|
+
- [charts] Replace props `id` by `seriesId` when necessary (#21057) @alexfauquette
|
|
100
|
+
- [charts] Revert `touch-action: pan-y` removal when zoom is disabled (#20852) @bernardobelchior
|
|
101
|
+
- [charts] The `useXxxSeries([])` return empty array (#21001) @alexfauquette
|
|
102
|
+
- [charts] Use `NumberValue` in domain limit function (#21054) @JCQuintas
|
|
103
|
+
|
|
104
|
+
#### `@mui/x-charts-pro@9.0.0-alpha.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
105
|
+
|
|
106
|
+
Same changes as in `@mui/x-charts@9.0.0-alpha.0`, plus:
|
|
107
|
+
|
|
108
|
+
- [charts-pro] Add border radius to heatmap (#20931) @bernardobelchior
|
|
109
|
+
- [charts-pro] Add keyboard navigation to funnel (#20766) @alexfauquette
|
|
110
|
+
- [charts-pro] Add keyboard navigation to heatmap (#20786) @alexfauquette
|
|
111
|
+
- [charts-pro] Add keyboard navigation to sankey (#20777) @alexfauquette
|
|
112
|
+
- [charts-pro] Fix Heatmap's `onItemClick` not triggering (#21016) @bernardobelchior
|
|
113
|
+
- [charts-pro] Fix crash when two same-direction axes have a zoom preview (#20916) @bernardobelchior
|
|
114
|
+
- [charts-pro] Handle edge case in export image (#21190) @bernardobelchior
|
|
115
|
+
- [charts-pro] Prefer global pointer interaction tracker in Heatmap (#20697) @bernardobelchior
|
|
116
|
+
- [charts-pro] Support composition for Sankey (#20604) @alexfauquette
|
|
117
|
+
- [charts-pro] Update Heatmap identifier (#21124) @alexfauquette
|
|
118
|
+
- [charts-pro] Update default value of `hideLegend` prop in `Heatmap` (#20961) @Copilot
|
|
119
|
+
|
|
120
|
+
#### `@mui/x-charts-premium@9.0.0-alpha.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
121
|
+
|
|
122
|
+
Same changes as in `@mui/x-charts-pro@9.0.0-alpha.0`, plus:
|
|
123
|
+
|
|
124
|
+
- [charts-premium] Add WebGL renderer to Heatmap (#20756) @bernardobelchior
|
|
125
|
+
- [charts-premium] Add `ChartContainerPremium` (#20910) @bernardobelchior
|
|
126
|
+
- [charts-premium] Add `HeatmapPremium` (#20930) @bernardobelchior
|
|
127
|
+
- [charts-premium] Add keyboard navigation to range-bar (#21272) @alexfauquette
|
|
128
|
+
- [charts-premium] Extract `HeatmapSVGPlot` from `HeatmapPlot` component (#21015) @bernardobelchior
|
|
129
|
+
- [charts-premium] Fix `ChartDataProviderPremium` tests (#20868) @bernardobelchior
|
|
130
|
+
- [charts-premium] Fix links in comments for chart containers and data providers (#21105) @bernardobelchior
|
|
131
|
+
|
|
132
|
+
### Tree View
|
|
133
|
+
|
|
134
|
+
#### `@mui/x-tree-view@9.0.0-alpha.0`
|
|
135
|
+
|
|
136
|
+
_No changes._
|
|
137
|
+
|
|
138
|
+
#### `@mui/x-tree-view-pro@9.0.0-alpha.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
139
|
+
|
|
140
|
+
Same changes as in `@mui/x-tree-view@9.0.0-alpha.0`, plus:
|
|
141
|
+
|
|
142
|
+
- [RichTreeViewPro] Add support for virtualization (#20780) @flaviendelangle
|
|
143
|
+
|
|
144
|
+
### Codemod
|
|
145
|
+
|
|
146
|
+
#### `@mui/x-codemod@9.0.0-alpha.0`
|
|
147
|
+
|
|
148
|
+
- [codemod] Document and Clean the codemod utils (#21014) @alexfauquette
|
|
149
|
+
|
|
150
|
+
### Docs
|
|
151
|
+
|
|
152
|
+
- [docs] Add focus highlight in composition snipets (#20614) @alexfauquette
|
|
153
|
+
- [docs] Add simple candlestick chart demo (#20912) @bernardobelchior
|
|
154
|
+
- [docs] Fix Waterfall Chart documentation badge from Pro to Premium (#20888) @Copilot
|
|
155
|
+
- [docs] Fix broken links on Data Grid Editing sub-pages (#20911) @arminmeh
|
|
156
|
+
- [docs] Fix docs API for HeatmapPremium (#21137) @alexfauquette
|
|
157
|
+
- [docs] Fix horizontal overflow in heatmap docs (#20968) @bernardobelchior
|
|
158
|
+
- [docs] Move Range Bar Chart to existing charts (#21120) @bernardobelchior
|
|
159
|
+
- [docs] Prepare the scheduler doc for the alpha (#21268) @flaviendelangle
|
|
160
|
+
- [docs] Rewording of the heatmap item click (#20987) @alexfauquette
|
|
161
|
+
- [scheduler][docs] Create the Quickstart page (#20913) @flaviendelangle
|
|
162
|
+
- [charts][docs] Revise the Charts CSP doc (#20906) @mapache-salvaje
|
|
163
|
+
- [charts][docs] Revise the Charts Composition doc (#20032) @mapache-salvaje
|
|
164
|
+
- [charts][docs] Revise the Charts Hooks Overview doc (#20921) @mapache-salvaje
|
|
165
|
+
- [charts][docs] Revise the Charts Legend doc (#20821) @mapache-salvaje
|
|
166
|
+
- [charts][docs] Revise the Charts Localization doc (#20800) @mapache-salvaje
|
|
167
|
+
- [charts][docs] Revise the Charts Plugins doc (#20933) @mapache-salvaje
|
|
168
|
+
- [charts][docs] Revise the Charts Stacking doc (#20830) @mapache-salvaje
|
|
169
|
+
- [charts][docs] Revise the Charts Styling doc (#20835) @mapache-salvaje
|
|
170
|
+
- [charts][docs] Revise the Charts Toolbar doc (#20867) @mapache-salvaje
|
|
171
|
+
- [charts][docs] Revise the Charts Tooltip doc (#20869) @mapache-salvaje
|
|
172
|
+
- [charts][docs] Revise the Charts Zoom and Pan doc (#20893) @mapache-salvaje
|
|
173
|
+
- [DataGrid][docs] Add a recipe for handling long text cell (#20754) @siriwatknp
|
|
174
|
+
- [DataGrid][docs] Add high-level competitor comparison to Overview doc (DX-117) (#20870) @mapache-salvaje
|
|
175
|
+
- [DataGrid][docs] Remove Bundling section from quickstart (#21177) @MBilalShafi
|
|
176
|
+
|
|
177
|
+
### Core
|
|
178
|
+
|
|
179
|
+
- [code-infra] Add `MUI_TEST_ENV` global (#21187) @Janpot
|
|
180
|
+
- [code-infra] Fix `material-ui/disallow-react-api-in-server-components` (#20909) @JCQuintas
|
|
181
|
+
- [code-infra] Fix `renameImports` codemod not preserving comments (#20977) @JCQuintas
|
|
182
|
+
- [code-infra] Fix the label comparison to use lower case (#20934) @brijeshb42
|
|
183
|
+
- [code-infra] Github action to sync title and label (#20922) @brijeshb42
|
|
184
|
+
- [code-infra] Ignore scheduler demo with random data (#20982) @JCQuintas
|
|
185
|
+
- [code-infra] Improve `codemod` testing setup (#20981) @JCQuintas
|
|
186
|
+
- [code-infra] Only ignore renovate[bot] in changelog generation script (#21185) @bernardobelchior
|
|
187
|
+
- [code-infra] Prepare for v9 (#20860) @JCQuintas
|
|
188
|
+
- [code-infra] Set `rasterizehtml` version in pnpm catalog (#21175) @bernardobelchior
|
|
189
|
+
- [code-infra] Update codeowners (#20886) @JCQuintas
|
|
190
|
+
- [code-infra] V9 preparation (#20928) @JCQuintas
|
|
191
|
+
- [code-infra] eslint rule rename (#21172) @Janpot
|
|
192
|
+
- [code-infra][docs] V9 charts migration doc kickoff (#20973) @JCQuintas
|
|
193
|
+
- [docs-infra] Add Cookie Banner and Analytics Provider (#21228) @dav-is
|
|
194
|
+
- [docs-infra] Fix missing slots section on API page (#20915) @Janpot
|
|
195
|
+
- [docs-infra] Fix two broken links (#20914) @Janpot
|
|
196
|
+
- [docs-infra] Port demo changes (#20971) @Janpot
|
|
197
|
+
- [internal] Add information about codemods to AGENTS.md (#21011) @bernardobelchior
|
|
198
|
+
- [internal] Fix codemod versioning instructions in `AGENTS.md` (#21024) @bernardobelchior
|
|
199
|
+
- [internal] Fix missing generated props in master (#21142) @bernardobelchior
|
|
200
|
+
- [internal] Headless sorting plugin (#21089) @arminmeh
|
|
201
|
+
- [internal] Remove duplicate code (#20896) @oliviertassinari
|
|
202
|
+
|
|
203
|
+
### Miscellaneous
|
|
204
|
+
|
|
205
|
+
- Bump next to ^15.5.11 (#21171) @Copilot
|
|
206
|
+
- [core] Fix CI (#21223) @flaviendelangle
|
|
207
|
+
- [PoC] Headless data grid (#20645) @cherniavskii
|
|
208
|
+
|
|
209
|
+
## v8.27.1
|
|
210
|
+
|
|
211
|
+
_Feb 13, 2026_
|
|
212
|
+
|
|
213
|
+
We'd like to extend a big thank you to the 6 contributors who made this release possible. Here are some highlights ✨:
|
|
214
|
+
|
|
215
|
+
- 📝 CSS bundler support is no longer needed for the Data Grid
|
|
216
|
+
- 🐞 Bugfixes
|
|
217
|
+
|
|
218
|
+
Special thanks go out to these community members for their valuable contributions:
|
|
219
|
+
@sai6855
|
|
220
|
+
|
|
221
|
+
The following team members contributed to this release:
|
|
222
|
+
@arminmeh, @cherniavskii, @flaviendelangle, @mj12albert, @MBilalShafi
|
|
223
|
+
|
|
224
|
+
### Data Grid
|
|
225
|
+
|
|
226
|
+
#### `@mui/x-data-grid@8.27.1`
|
|
227
|
+
|
|
228
|
+
- [DataGrid] Hide column menu icon when there are no items (#21303) @MBilalShafi
|
|
229
|
+
- [DataGrid] Migrate styled imports and remove `index.css` (#21176) @MBilalShafi
|
|
230
|
+
- [DataGrid] Optimize `GridRootStyles` overrides resolver (#21251) @sai6855
|
|
231
|
+
|
|
232
|
+
#### `@mui/x-data-grid-pro@8.27.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
233
|
+
|
|
234
|
+
Same changes as in `@mui/x-data-grid@8.27.1`, plus:
|
|
235
|
+
|
|
236
|
+
- [DataGridPro] Fix column pinning issue with `restoreState` (#21305) @MBilalShafi
|
|
237
|
+
- [DataGridPro] Fix lazy loading params for page with one row (#21238) @MBilalShafi
|
|
238
|
+
- [DataGridPro] Properly extract parent path (#21301) @arminmeh
|
|
239
|
+
|
|
240
|
+
#### `@mui/x-data-grid-premium@8.27.1` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
241
|
+
|
|
242
|
+
Same changes as in `@mui/x-data-grid-pro@8.27.1`, plus:
|
|
243
|
+
|
|
244
|
+
- [DataGridPremium] Fix aggregation display when `initialState` has both `sortModel` and `pinnedColumns` (#21152) @mj12albert
|
|
245
|
+
|
|
246
|
+
### Tree View
|
|
247
|
+
|
|
248
|
+
#### `@mui/x-tree-view@8.27.1`
|
|
249
|
+
|
|
250
|
+
- [tree view] Fix `apiRef.current.setItemExpansion()` (#21095) @flaviendelangle
|
|
251
|
+
|
|
252
|
+
#### `@mui/x-tree-view-pro@8.27.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
253
|
+
|
|
254
|
+
Same changes as in `@mui/x-tree-view@8.27.1`.
|
|
255
|
+
|
|
256
|
+
### Core
|
|
257
|
+
|
|
258
|
+
- [internal] Add CLI for translation using LLM (#21299) @cherniavskii
|
|
259
|
+
|
|
260
|
+
## v8.27.0
|
|
261
|
+
|
|
262
|
+
_Feb 2, 2026_
|
|
263
|
+
|
|
264
|
+
We'd like to extend a big thank you to the 8 contributors who made this release possible. Here are some highlights ✨:
|
|
265
|
+
|
|
266
|
+
- 📝 Data Grid supports new `longText` [column type](https://mui.com/x/react-data-grid/column-definition/#column-types)
|
|
267
|
+
|
|
268
|
+
The following team members contributed to this release:
|
|
269
|
+
@alexfauquette, @arminmeh, @bernardobelchior, @cherniavskii, @flaviendelangle, @JCQuintas, @MBilalShafi, @siriwatknp
|
|
270
|
+
|
|
271
|
+
### Data Grid
|
|
272
|
+
|
|
273
|
+
#### `@mui/x-data-grid@8.27.0`
|
|
274
|
+
|
|
275
|
+
- [DataGrid] Fix virtualization crash by preventing out-of-bounds `focusedVirtualCell` indices (#21123) @cherniavskii
|
|
276
|
+
- [DataGrid] Fix focus steal issue with `<Dialog />` (#21106) @MBilalShafi
|
|
277
|
+
- [DataGrid] Add new `longText` column type (#21103) @siriwatknp
|
|
278
|
+
|
|
279
|
+
#### `@mui/x-data-grid-pro@8.27.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
280
|
+
|
|
281
|
+
Same changes as in `@mui/x-data-grid@8.27.0`.
|
|
282
|
+
|
|
283
|
+
#### `@mui/x-data-grid-premium@8.27.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
284
|
+
|
|
285
|
+
Same changes as in `@mui/x-data-grid-pro@8.27.0`, plus:
|
|
286
|
+
|
|
287
|
+
- [DataGridPremium] Fix focus retention when undo/redo operations are done on the same cell (#21110) @arminmeh
|
|
288
|
+
|
|
289
|
+
### Date and Time Pickers
|
|
290
|
+
|
|
291
|
+
#### `@mui/x-date-pickers@8.27.0`
|
|
292
|
+
|
|
293
|
+
Internal changes.
|
|
294
|
+
|
|
295
|
+
#### `@mui/x-date-pickers-pro@8.27.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
296
|
+
|
|
297
|
+
Same changes as in `@mui/x-date-pickers@8.27.0`.
|
|
298
|
+
|
|
299
|
+
### Charts
|
|
300
|
+
|
|
301
|
+
#### `@mui/x-charts@8.27.0`
|
|
302
|
+
|
|
303
|
+
- [charts] Deprecate `AxisId` class in favour of to `data-axis-id` attribute (#21048) @JCQuintas
|
|
304
|
+
|
|
305
|
+
#### `@mui/x-charts-pro@8.27.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
306
|
+
|
|
307
|
+
Same changes as in `@mui/x-charts@8.27.0`, plus:
|
|
308
|
+
|
|
309
|
+
- [charts-pro] Add `onItemClick` to the heatmap (#20817) (#21030) @alexfauquette
|
|
310
|
+
|
|
311
|
+
#### `@mui/x-charts-premium@8.27.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
312
|
+
|
|
313
|
+
Same changes as in `@mui/x-charts-pro@8.27.0`, plus:
|
|
314
|
+
|
|
315
|
+
- [charts-premium] Fix wrong `defaultSlots` in premium charts (#21052) @bernardobelchior
|
|
316
|
+
|
|
317
|
+
### Tree View
|
|
318
|
+
|
|
319
|
+
#### `@mui/x-tree-view@8.27.0`
|
|
320
|
+
|
|
321
|
+
Internal changes.
|
|
322
|
+
|
|
323
|
+
#### `@mui/x-tree-view-pro@8.27.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
324
|
+
|
|
325
|
+
Same changes as in `@mui/x-tree-view@8.27.0`, plus:
|
|
326
|
+
|
|
327
|
+
- [RichTreeViewPro] Do not export `useSimpleTreeViewApiRef()` and `useRichTreeViewApiRef()` from pro package (#21145) @flaviendelangle
|
|
328
|
+
|
|
329
|
+
### Codemod
|
|
330
|
+
|
|
331
|
+
#### `@mui/x-codemod@8.27.0`
|
|
332
|
+
|
|
333
|
+
Internal changes.
|
|
334
|
+
|
|
335
|
+
### Docs
|
|
336
|
+
|
|
337
|
+
- [docs] Fix DataGrid's cell edit renderers (@arminmeh) (#21041) @github-actions[bot]
|
|
338
|
+
|
|
339
|
+
### Core
|
|
340
|
+
|
|
341
|
+
- [code-infra] Add `consistent-type-imports` rule to the grid packages (#21119) @arminmeh
|
|
342
|
+
- [code-infra] Allow user to select target branch if it exists for current major (#21005) @JCQuintas
|
|
343
|
+
- [code-infra] Fix the target branch condition in the release script (#21051) @arminmeh
|
|
344
|
+
- [code-infra] Update docs deploy script to fetch from `v8.x` (#21013) @arminmeh
|
|
345
|
+
|
|
346
|
+
## 8.26.1
|
|
347
|
+
|
|
348
|
+
_Jan 23, 2026_
|
|
349
|
+
|
|
350
|
+
Release highlight ✨:
|
|
351
|
+
|
|
352
|
+
- 🐞 Hotfix for Data Grid Premium type imports
|
|
353
|
+
|
|
354
|
+
### Data Grid
|
|
355
|
+
|
|
356
|
+
#### `@mui/x-data-grid-premium@8.26.1` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
357
|
+
|
|
358
|
+
- [DataGridPremium] Fix type import (#21033) @arminmeh
|
|
359
|
+
|
|
360
|
+
## 8.26.0
|
|
361
|
+
|
|
362
|
+
_Jan 22, 2026_
|
|
363
|
+
|
|
364
|
+
We'd like to extend a big thank you to the 6 contributors who made this release possible. Here are some highlights ✨:
|
|
365
|
+
|
|
366
|
+
- 🔄 Data Grid now supports undo and redo actions. See the [Undo and redo](https://mui.com/x/react-data-grid/undo-redo/) page for details about out-of-the-box support and customization options.
|
|
367
|
+
- 🐞 Bugfixes
|
|
368
|
+
|
|
369
|
+
Special thanks go out to these community members for their valuable contributions:
|
|
370
|
+
@jhe-iqbis
|
|
371
|
+
|
|
372
|
+
The following team members contributed to this release:
|
|
373
|
+
@arminmeh, @cherniavskii, @flaviendelangle, @JCQuintas, @romgrk
|
|
374
|
+
|
|
375
|
+
### Data Grid
|
|
376
|
+
|
|
377
|
+
#### `@mui/x-data-grid@8.26.0`
|
|
378
|
+
|
|
379
|
+
- [DataGrid] Add `onMenuOpen()` and `onMenuClose()` event handlers in `GridActionsCell` (#20994) @jhe-iqbis
|
|
380
|
+
- [DataGrid] Fix scroll position when virtualization is disabled (#20958) @romgrk
|
|
381
|
+
|
|
382
|
+
#### `@mui/x-data-grid-pro@8.26.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
383
|
+
|
|
384
|
+
Same changes as in `@mui/x-data-grid@8.26.0`.
|
|
385
|
+
|
|
386
|
+
#### `@mui/x-data-grid-premium@8.26.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
387
|
+
|
|
388
|
+
Same changes as in `@mui/x-data-grid-pro@8.26.0`, plus:
|
|
389
|
+
|
|
390
|
+
- [DataGridPremium] Undo and redo (#20993) @arminmeh
|
|
391
|
+
|
|
392
|
+
### Date and Time Pickers
|
|
393
|
+
|
|
394
|
+
#### `@mui/x-date-pickers@8.26.0`
|
|
395
|
+
|
|
396
|
+
Internal changes.
|
|
397
|
+
|
|
398
|
+
#### `@mui/x-date-pickers-pro@8.26.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
399
|
+
|
|
400
|
+
Same changes as in `@mui/x-date-pickers@8.26.0`.
|
|
401
|
+
|
|
402
|
+
### Charts
|
|
403
|
+
|
|
404
|
+
#### `@mui/x-charts@8.26.0`
|
|
405
|
+
|
|
406
|
+
Internal changes.
|
|
407
|
+
|
|
408
|
+
#### `@mui/x-charts-pro@8.26.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
409
|
+
|
|
410
|
+
Same changes as in `@mui/x-charts@8.26.0`.
|
|
411
|
+
|
|
412
|
+
#### `@mui/x-charts-premium@8.26.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
413
|
+
|
|
414
|
+
Same changes as in `@mui/x-charts-pro@8.26.0`.
|
|
415
|
+
|
|
416
|
+
### Tree View
|
|
417
|
+
|
|
418
|
+
#### `@mui/x-tree-view@8.26.0`
|
|
419
|
+
|
|
420
|
+
- [tree view] Fix `props.id` not passed to the root element (#20976) @flaviendelangle
|
|
421
|
+
|
|
422
|
+
#### `@mui/x-tree-view-pro@8.26.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
423
|
+
|
|
424
|
+
Same changes as in `@mui/x-tree-view@8.26.0`.
|
|
425
|
+
|
|
426
|
+
### Codemod
|
|
427
|
+
|
|
428
|
+
#### `@mui/x-codemod@8.26.0`
|
|
429
|
+
|
|
430
|
+
Internal changes.
|
|
431
|
+
|
|
432
|
+
### Docs
|
|
433
|
+
|
|
434
|
+
- [docs] Recipe for lazy loading DataGrid's detail panels with auto height (#20995) @arminmeh
|
|
435
|
+
|
|
436
|
+
### Core
|
|
437
|
+
|
|
438
|
+
- [code-infra] Update `master` to `v8` references (#20864) @JCQuintas
|
|
439
|
+
- [code-infra] Update v8 branch tags (#20926) @JCQuintas
|
|
440
|
+
- [code-infra] V8 changes in master (#20919) @JCQuintas
|
|
441
|
+
- [code-infra] Allow user to select target branch if it exists for current major (#21005) @JCQuintas
|
|
442
|
+
- [internal] Set up shared instructions for coding agents (#21000) @cherniavskii
|
|
7
443
|
|
|
8
444
|
## 8.25.0
|
|
9
445
|
|
|
@@ -1,9 +1,13 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import * as React from 'react';
|
|
1
4
|
import useForkRef from '@mui/utils/useForkRef';
|
|
2
5
|
import useEventCallback from '@mui/utils/useEventCallback';
|
|
3
6
|
import * as platform from '@mui/x-internals/platform';
|
|
4
7
|
import { createSelectorMemoized } from '@mui/x-internals/store';
|
|
5
8
|
import { Dimensions } from "../dimensions.js";
|
|
6
9
|
import { Virtualization } from "./virtualization.js";
|
|
10
|
+
import useRefCallback from "../../utils/useRefCallback.js";
|
|
7
11
|
|
|
8
12
|
/* eslint-disable react-hooks/rules-of-hooks */
|
|
9
13
|
|
|
@@ -27,8 +31,8 @@ export class LayoutDataGrid extends Layout {
|
|
|
27
31
|
scrollerRef,
|
|
28
32
|
containerRef
|
|
29
33
|
} = layoutParams;
|
|
30
|
-
const scrollbarVerticalRef =
|
|
31
|
-
const scrollbarHorizontalRef =
|
|
34
|
+
const scrollbarVerticalRef = useScrollbarRefCallback(this.refs.scroller, this.refSetter('scrollbarVertical'), 'scrollTop');
|
|
35
|
+
const scrollbarHorizontalRef = useScrollbarRefCallback(this.refs.scroller, this.refSetter('scrollbarHorizontal'), 'scrollLeft');
|
|
32
36
|
store.state.virtualization.context = {
|
|
33
37
|
scrollerRef,
|
|
34
38
|
containerRef,
|
|
@@ -43,8 +47,10 @@ export class LayoutDataGrid extends Layout {
|
|
|
43
47
|
scrollerProps: createSelectorMemoized(Virtualization.selectors.context, Dimensions.selectors.autoHeight, Dimensions.selectors.needsHorizontalScrollbar, (context, autoHeight, needsHorizontalScrollbar) => ({
|
|
44
48
|
ref: context.scrollerRef,
|
|
45
49
|
style: {
|
|
50
|
+
// TODO: fall back to overflow: 'auto' if no overflowX or overflowY is set?
|
|
46
51
|
overflowX: !needsHorizontalScrollbar ? 'hidden' : undefined,
|
|
47
52
|
overflowY: autoHeight ? 'hidden' : undefined
|
|
53
|
+
// TODO: should include display: 'flex', flexDirection: 'column' since the Content has flexBasis and flexShrink?
|
|
48
54
|
},
|
|
49
55
|
role: 'presentation',
|
|
50
56
|
// `tabIndex` shouldn't be used along role=presentation, but it fixes a Firefox bug
|
|
@@ -149,4 +155,55 @@ export class LayoutList extends Layout {
|
|
|
149
155
|
}
|
|
150
156
|
}))
|
|
151
157
|
}))();
|
|
158
|
+
}
|
|
159
|
+
function useScrollbarRefCallback(scrollerRef, refSetter, scrollProperty) {
|
|
160
|
+
const isLocked = React.useRef(false);
|
|
161
|
+
const lastPosition = React.useRef(0);
|
|
162
|
+
const handleScrollerScroll = useEventCallback(scrollbar => {
|
|
163
|
+
const scroller = scrollerRef.current;
|
|
164
|
+
if (!scroller) {
|
|
165
|
+
return;
|
|
166
|
+
}
|
|
167
|
+
const scrollerPosition = scroller[scrollProperty];
|
|
168
|
+
if (scrollerPosition === lastPosition.current) {
|
|
169
|
+
return;
|
|
170
|
+
}
|
|
171
|
+
lastPosition.current = scrollerPosition;
|
|
172
|
+
if (isLocked.current) {
|
|
173
|
+
isLocked.current = false;
|
|
174
|
+
return;
|
|
175
|
+
}
|
|
176
|
+
isLocked.current = true;
|
|
177
|
+
scrollbar[scrollProperty] = scrollerPosition;
|
|
178
|
+
});
|
|
179
|
+
const handleScrollbarScroll = useEventCallback(scrollbar => {
|
|
180
|
+
const scroller = scrollerRef.current;
|
|
181
|
+
if (!scroller) {
|
|
182
|
+
return;
|
|
183
|
+
}
|
|
184
|
+
if (isLocked.current) {
|
|
185
|
+
isLocked.current = false;
|
|
186
|
+
return;
|
|
187
|
+
}
|
|
188
|
+
isLocked.current = true;
|
|
189
|
+
scroller[scrollProperty] = scrollbar[scrollProperty];
|
|
190
|
+
});
|
|
191
|
+
return useRefCallback(scrollbar => {
|
|
192
|
+
refSetter(scrollbar);
|
|
193
|
+
const scroller = scrollerRef.current;
|
|
194
|
+
if (!scroller) {
|
|
195
|
+
return undefined;
|
|
196
|
+
}
|
|
197
|
+
const onScrollerScroll = () => handleScrollerScroll(scrollbar);
|
|
198
|
+
const onScrollbarScroll = () => handleScrollbarScroll(scrollbar);
|
|
199
|
+
const options = {
|
|
200
|
+
passive: true
|
|
201
|
+
};
|
|
202
|
+
scroller.addEventListener('scroll', onScrollerScroll, options);
|
|
203
|
+
scrollbar.addEventListener('scroll', onScrollbarScroll, options);
|
|
204
|
+
return () => {
|
|
205
|
+
scroller.removeEventListener('scroll', onScrollerScroll);
|
|
206
|
+
scrollbar.removeEventListener('scroll', onScrollbarScroll);
|
|
207
|
+
};
|
|
208
|
+
});
|
|
152
209
|
}
|
|
@@ -10,7 +10,7 @@ import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
|
|
|
10
10
|
import * as platform from '@mui/x-internals/platform';
|
|
11
11
|
import { useRunOnce } from '@mui/x-internals/useRunOnce';
|
|
12
12
|
import { createSelector, useStore, useStoreEffect } from '@mui/x-internals/store';
|
|
13
|
-
import
|
|
13
|
+
import useRefCallback from "../../utils/useRefCallback.js";
|
|
14
14
|
import { PinnedRows, PinnedColumns } from "../../models/core.js";
|
|
15
15
|
import { Dimensions, observeRootNode } from "../dimensions.js";
|
|
16
16
|
import { ScrollPosition, ScrollDirection } from "../../models/index.js";
|
|
@@ -208,6 +208,12 @@ function useVirtualization(store, params, api) {
|
|
|
208
208
|
updateRenderContext(nextRenderContext);
|
|
209
209
|
});
|
|
210
210
|
scrollTimeout.start(1000, triggerUpdateRenderContext);
|
|
211
|
+
} else {
|
|
212
|
+
store.set('virtualization', _extends({}, store.state.virtualization, {
|
|
213
|
+
scrollPosition: {
|
|
214
|
+
current: _extends({}, scrollPosition.current)
|
|
215
|
+
}
|
|
216
|
+
}));
|
|
211
217
|
}
|
|
212
218
|
return nextRenderContext;
|
|
213
219
|
});
|
|
@@ -285,11 +291,11 @@ function useVirtualization(store, params, api) {
|
|
|
285
291
|
let virtualRowIndex = -1;
|
|
286
292
|
const focusedVirtualCell = params.focusedVirtualCell?.();
|
|
287
293
|
if (!isPinnedSection && focusedVirtualCell) {
|
|
288
|
-
if (focusedVirtualCell.rowIndex < firstRowToRender) {
|
|
294
|
+
if (focusedVirtualCell.rowIndex < firstRowToRender && focusedVirtualCell.rowIndex >= 0 && focusedVirtualCell.rowIndex < rowModels.length) {
|
|
289
295
|
rowIndexes.unshift(focusedVirtualCell.rowIndex);
|
|
290
296
|
virtualRowIndex = focusedVirtualCell.rowIndex;
|
|
291
297
|
}
|
|
292
|
-
if (focusedVirtualCell.rowIndex > lastRowToRender) {
|
|
298
|
+
if (focusedVirtualCell.rowIndex > lastRowToRender && focusedVirtualCell.rowIndex < rowModels.length) {
|
|
293
299
|
rowIndexes.push(focusedVirtualCell.rowIndex);
|
|
294
300
|
virtualRowIndex = focusedVirtualCell.rowIndex;
|
|
295
301
|
}
|
|
@@ -498,22 +504,6 @@ function useVirtualization(store, params, api) {
|
|
|
498
504
|
scheduleUpdateRenderContext
|
|
499
505
|
}, createSpanningAPI());
|
|
500
506
|
}
|
|
501
|
-
function useRefCallback(fn) {
|
|
502
|
-
const refCleanup = React.useRef(undefined);
|
|
503
|
-
const refCallback = useEventCallback(node => {
|
|
504
|
-
if (!node) {
|
|
505
|
-
// Cleanup for R18
|
|
506
|
-
refCleanup.current?.();
|
|
507
|
-
return;
|
|
508
|
-
}
|
|
509
|
-
refCleanup.current = fn(node);
|
|
510
|
-
if (reactMajor >= 19) {
|
|
511
|
-
/* eslint-disable-next-line consistent-return */
|
|
512
|
-
return refCleanup.current;
|
|
513
|
-
}
|
|
514
|
-
});
|
|
515
|
-
return refCallback;
|
|
516
|
-
}
|
|
517
507
|
function inputsSelector(store, params, api, enabledForRows, enabledForColumns) {
|
|
518
508
|
const dimensions = Dimensions.selectors.dimensions(store.state);
|
|
519
509
|
const rows = params.rows;
|
package/esm/index.js
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function useRefCallback(fn: (node: HTMLDivElement) => (() => void) | undefined): (node: HTMLDivElement | null) => (() => void | undefined) | undefined;
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
import useEventCallback from '@mui/utils/useEventCallback';
|
|
5
|
+
import reactMajor from '@mui/x-internals/reactMajor';
|
|
6
|
+
export default function useRefCallback(fn) {
|
|
7
|
+
const refCleanup = React.useRef(undefined);
|
|
8
|
+
const refCallback = useEventCallback(node => {
|
|
9
|
+
if (!node) {
|
|
10
|
+
// Cleanup for R18
|
|
11
|
+
refCleanup.current?.();
|
|
12
|
+
return;
|
|
13
|
+
}
|
|
14
|
+
refCleanup.current = fn(node);
|
|
15
|
+
if (reactMajor >= 19) {
|
|
16
|
+
/* eslint-disable-next-line consistent-return */
|
|
17
|
+
return refCleanup.current;
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
return refCallback;
|
|
21
|
+
}
|
|
@@ -1,17 +1,20 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
'use client';
|
|
2
3
|
|
|
3
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
5
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
6
|
Object.defineProperty(exports, "__esModule", {
|
|
6
7
|
value: true
|
|
7
8
|
});
|
|
8
9
|
exports.LayoutList = exports.LayoutDataGridLegacy = exports.LayoutDataGrid = exports.Layout = void 0;
|
|
10
|
+
var React = _interopRequireWildcard(require("react"));
|
|
9
11
|
var _useForkRef = _interopRequireDefault(require("@mui/utils/useForkRef"));
|
|
10
12
|
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
11
13
|
var platform = _interopRequireWildcard(require("@mui/x-internals/platform"));
|
|
12
14
|
var _store = require("@mui/x-internals/store");
|
|
13
15
|
var _dimensions = require("../../features/dimensions");
|
|
14
16
|
var _virtualization = require("./virtualization");
|
|
17
|
+
var _useRefCallback = _interopRequireDefault(require("../../utils/useRefCallback"));
|
|
15
18
|
/* eslint-disable react-hooks/rules-of-hooks */
|
|
16
19
|
|
|
17
20
|
class Layout {
|
|
@@ -35,8 +38,8 @@ class LayoutDataGrid extends Layout {
|
|
|
35
38
|
scrollerRef,
|
|
36
39
|
containerRef
|
|
37
40
|
} = layoutParams;
|
|
38
|
-
const scrollbarVerticalRef = (
|
|
39
|
-
const scrollbarHorizontalRef = (
|
|
41
|
+
const scrollbarVerticalRef = useScrollbarRefCallback(this.refs.scroller, this.refSetter('scrollbarVertical'), 'scrollTop');
|
|
42
|
+
const scrollbarHorizontalRef = useScrollbarRefCallback(this.refs.scroller, this.refSetter('scrollbarHorizontal'), 'scrollLeft');
|
|
40
43
|
store.state.virtualization.context = {
|
|
41
44
|
scrollerRef,
|
|
42
45
|
containerRef,
|
|
@@ -51,8 +54,10 @@ class LayoutDataGrid extends Layout {
|
|
|
51
54
|
scrollerProps: (0, _store.createSelectorMemoized)(_virtualization.Virtualization.selectors.context, _dimensions.Dimensions.selectors.autoHeight, _dimensions.Dimensions.selectors.needsHorizontalScrollbar, (context, autoHeight, needsHorizontalScrollbar) => ({
|
|
52
55
|
ref: context.scrollerRef,
|
|
53
56
|
style: {
|
|
57
|
+
// TODO: fall back to overflow: 'auto' if no overflowX or overflowY is set?
|
|
54
58
|
overflowX: !needsHorizontalScrollbar ? 'hidden' : undefined,
|
|
55
59
|
overflowY: autoHeight ? 'hidden' : undefined
|
|
60
|
+
// TODO: should include display: 'flex', flexDirection: 'column' since the Content has flexBasis and flexShrink?
|
|
56
61
|
},
|
|
57
62
|
role: 'presentation',
|
|
58
63
|
// `tabIndex` shouldn't be used along role=presentation, but it fixes a Firefox bug
|
|
@@ -160,4 +165,55 @@ class LayoutList extends Layout {
|
|
|
160
165
|
}))
|
|
161
166
|
};
|
|
162
167
|
}
|
|
163
|
-
exports.LayoutList = LayoutList;
|
|
168
|
+
exports.LayoutList = LayoutList;
|
|
169
|
+
function useScrollbarRefCallback(scrollerRef, refSetter, scrollProperty) {
|
|
170
|
+
const isLocked = React.useRef(false);
|
|
171
|
+
const lastPosition = React.useRef(0);
|
|
172
|
+
const handleScrollerScroll = (0, _useEventCallback.default)(scrollbar => {
|
|
173
|
+
const scroller = scrollerRef.current;
|
|
174
|
+
if (!scroller) {
|
|
175
|
+
return;
|
|
176
|
+
}
|
|
177
|
+
const scrollerPosition = scroller[scrollProperty];
|
|
178
|
+
if (scrollerPosition === lastPosition.current) {
|
|
179
|
+
return;
|
|
180
|
+
}
|
|
181
|
+
lastPosition.current = scrollerPosition;
|
|
182
|
+
if (isLocked.current) {
|
|
183
|
+
isLocked.current = false;
|
|
184
|
+
return;
|
|
185
|
+
}
|
|
186
|
+
isLocked.current = true;
|
|
187
|
+
scrollbar[scrollProperty] = scrollerPosition;
|
|
188
|
+
});
|
|
189
|
+
const handleScrollbarScroll = (0, _useEventCallback.default)(scrollbar => {
|
|
190
|
+
const scroller = scrollerRef.current;
|
|
191
|
+
if (!scroller) {
|
|
192
|
+
return;
|
|
193
|
+
}
|
|
194
|
+
if (isLocked.current) {
|
|
195
|
+
isLocked.current = false;
|
|
196
|
+
return;
|
|
197
|
+
}
|
|
198
|
+
isLocked.current = true;
|
|
199
|
+
scroller[scrollProperty] = scrollbar[scrollProperty];
|
|
200
|
+
});
|
|
201
|
+
return (0, _useRefCallback.default)(scrollbar => {
|
|
202
|
+
refSetter(scrollbar);
|
|
203
|
+
const scroller = scrollerRef.current;
|
|
204
|
+
if (!scroller) {
|
|
205
|
+
return undefined;
|
|
206
|
+
}
|
|
207
|
+
const onScrollerScroll = () => handleScrollerScroll(scrollbar);
|
|
208
|
+
const onScrollbarScroll = () => handleScrollbarScroll(scrollbar);
|
|
209
|
+
const options = {
|
|
210
|
+
passive: true
|
|
211
|
+
};
|
|
212
|
+
scroller.addEventListener('scroll', onScrollerScroll, options);
|
|
213
|
+
scrollbar.addEventListener('scroll', onScrollbarScroll, options);
|
|
214
|
+
return () => {
|
|
215
|
+
scroller.removeEventListener('scroll', onScrollerScroll);
|
|
216
|
+
scrollbar.removeEventListener('scroll', onScrollbarScroll);
|
|
217
|
+
};
|
|
218
|
+
});
|
|
219
|
+
}
|
|
@@ -20,7 +20,7 @@ var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedE
|
|
|
20
20
|
var platform = _interopRequireWildcard(require("@mui/x-internals/platform"));
|
|
21
21
|
var _useRunOnce = require("@mui/x-internals/useRunOnce");
|
|
22
22
|
var _store = require("@mui/x-internals/store");
|
|
23
|
-
var
|
|
23
|
+
var _useRefCallback = _interopRequireDefault(require("../../utils/useRefCallback"));
|
|
24
24
|
var _core = require("../../models/core");
|
|
25
25
|
var _dimensions = require("../dimensions");
|
|
26
26
|
var _models = require("../../models");
|
|
@@ -217,6 +217,12 @@ function useVirtualization(store, params, api) {
|
|
|
217
217
|
updateRenderContext(nextRenderContext);
|
|
218
218
|
});
|
|
219
219
|
scrollTimeout.start(1000, triggerUpdateRenderContext);
|
|
220
|
+
} else {
|
|
221
|
+
store.set('virtualization', (0, _extends2.default)({}, store.state.virtualization, {
|
|
222
|
+
scrollPosition: {
|
|
223
|
+
current: (0, _extends2.default)({}, scrollPosition.current)
|
|
224
|
+
}
|
|
225
|
+
}));
|
|
220
226
|
}
|
|
221
227
|
return nextRenderContext;
|
|
222
228
|
});
|
|
@@ -294,11 +300,11 @@ function useVirtualization(store, params, api) {
|
|
|
294
300
|
let virtualRowIndex = -1;
|
|
295
301
|
const focusedVirtualCell = params.focusedVirtualCell?.();
|
|
296
302
|
if (!isPinnedSection && focusedVirtualCell) {
|
|
297
|
-
if (focusedVirtualCell.rowIndex < firstRowToRender) {
|
|
303
|
+
if (focusedVirtualCell.rowIndex < firstRowToRender && focusedVirtualCell.rowIndex >= 0 && focusedVirtualCell.rowIndex < rowModels.length) {
|
|
298
304
|
rowIndexes.unshift(focusedVirtualCell.rowIndex);
|
|
299
305
|
virtualRowIndex = focusedVirtualCell.rowIndex;
|
|
300
306
|
}
|
|
301
|
-
if (focusedVirtualCell.rowIndex > lastRowToRender) {
|
|
307
|
+
if (focusedVirtualCell.rowIndex > lastRowToRender && focusedVirtualCell.rowIndex < rowModels.length) {
|
|
302
308
|
rowIndexes.push(focusedVirtualCell.rowIndex);
|
|
303
309
|
virtualRowIndex = focusedVirtualCell.rowIndex;
|
|
304
310
|
}
|
|
@@ -455,7 +461,7 @@ function useVirtualization(store, params, api) {
|
|
|
455
461
|
}
|
|
456
462
|
}, [layout.refs.scroller, columnsTotalWidth, contentHeight]);
|
|
457
463
|
const isFirstSizing = React.useRef(true);
|
|
458
|
-
const containerRef =
|
|
464
|
+
const containerRef = (0, _useRefCallback.default)(node => {
|
|
459
465
|
layout.refs.container.current = node;
|
|
460
466
|
const unsubscribe = (0, _dimensions.observeRootNode)(node, store, rootSize => {
|
|
461
467
|
if (rootSize.width === 0 && rootSize.height === 0 && store.state.rootSize.height !== 0 && store.state.rootSize.width !== 0) {
|
|
@@ -475,7 +481,7 @@ function useVirtualization(store, params, api) {
|
|
|
475
481
|
layout.refs.container.current = null;
|
|
476
482
|
};
|
|
477
483
|
});
|
|
478
|
-
const scrollerRef =
|
|
484
|
+
const scrollerRef = (0, _useRefCallback.default)(node => {
|
|
479
485
|
layout.refs.scroller.current = node;
|
|
480
486
|
const opts = {
|
|
481
487
|
passive: true
|
|
@@ -507,22 +513,6 @@ function useVirtualization(store, params, api) {
|
|
|
507
513
|
scheduleUpdateRenderContext
|
|
508
514
|
}, createSpanningAPI());
|
|
509
515
|
}
|
|
510
|
-
function useRefCallback(fn) {
|
|
511
|
-
const refCleanup = React.useRef(undefined);
|
|
512
|
-
const refCallback = (0, _useEventCallback.default)(node => {
|
|
513
|
-
if (!node) {
|
|
514
|
-
// Cleanup for R18
|
|
515
|
-
refCleanup.current?.();
|
|
516
|
-
return;
|
|
517
|
-
}
|
|
518
|
-
refCleanup.current = fn(node);
|
|
519
|
-
if (_reactMajor.default >= 19) {
|
|
520
|
-
/* eslint-disable-next-line consistent-return */
|
|
521
|
-
return refCleanup.current;
|
|
522
|
-
}
|
|
523
|
-
});
|
|
524
|
-
return refCallback;
|
|
525
|
-
}
|
|
526
516
|
function inputsSelector(store, params, api, enabledForRows, enabledForColumns) {
|
|
527
517
|
const dimensions = _dimensions.Dimensions.selectors.dimensions(store.state);
|
|
528
518
|
const rows = params.rows;
|
package/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/x-virtualizer",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0-alpha.0",
|
|
4
4
|
"author": "MUI Team",
|
|
5
5
|
"description": "MUI virtualization library",
|
|
6
6
|
"license": "MIT",
|
|
@@ -27,9 +27,9 @@
|
|
|
27
27
|
"directory": "packages/x-virtualizer"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@babel/runtime": "^7.28.
|
|
31
|
-
"@mui/utils": "^7.3.
|
|
32
|
-
"@mui/x-internals": "
|
|
30
|
+
"@babel/runtime": "^7.28.6",
|
|
31
|
+
"@mui/utils": "^7.3.7",
|
|
32
|
+
"@mui/x-internals": "9.0.0-alpha.0"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function useRefCallback(fn: (node: HTMLDivElement) => (() => void) | undefined): (node: HTMLDivElement | null) => (() => void | undefined) | undefined;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
'use client';
|
|
3
|
+
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
5
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
6
|
+
Object.defineProperty(exports, "__esModule", {
|
|
7
|
+
value: true
|
|
8
|
+
});
|
|
9
|
+
exports.default = useRefCallback;
|
|
10
|
+
var React = _interopRequireWildcard(require("react"));
|
|
11
|
+
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
12
|
+
var _reactMajor = _interopRequireDefault(require("@mui/x-internals/reactMajor"));
|
|
13
|
+
function useRefCallback(fn) {
|
|
14
|
+
const refCleanup = React.useRef(undefined);
|
|
15
|
+
const refCallback = (0, _useEventCallback.default)(node => {
|
|
16
|
+
if (!node) {
|
|
17
|
+
// Cleanup for R18
|
|
18
|
+
refCleanup.current?.();
|
|
19
|
+
return;
|
|
20
|
+
}
|
|
21
|
+
refCleanup.current = fn(node);
|
|
22
|
+
if (_reactMajor.default >= 19) {
|
|
23
|
+
/* eslint-disable-next-line consistent-return */
|
|
24
|
+
return refCleanup.current;
|
|
25
|
+
}
|
|
26
|
+
});
|
|
27
|
+
return refCallback;
|
|
28
|
+
}
|