Skip to content

Commit b4bc89d

Browse files
nstepiennstepien
authored
React 19.2 (Comcast#3879)
* React 19.2 * remove eslint-plugin-react-compiler
1 parent f95e6c7 commit b4bc89d

6 files changed

Lines changed: 130 additions & 124 deletions

File tree

‎README.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ The DataGrid component is designed to handle large datasets efficiently while of
2020

2121
## Features
2222

23-
- [React 19.0+](package.json) support
23+
- [React 19.2+](package.json) support
2424
- Evergreen browsers and server-side rendering support
2525
- Tree-shaking support and only [one npm dependency](package.json) to keep your bundles slim
2626
- Great performance thanks to virtualization: columns and rows outside the viewport are not rendered

‎eslint.config.js‎

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@ import tsParser from '@typescript-eslint/parser';
55
import vitest from '@vitest/eslint-plugin';
66
import jestDom from 'eslint-plugin-jest-dom';
77
import react from 'eslint-plugin-react';
8-
import reactCompiler from 'eslint-plugin-react-compiler';
98
import reactHooks from 'eslint-plugin-react-hooks';
109
import sonarjs from 'eslint-plugin-sonarjs';
1110
import testingLibrary from 'eslint-plugin-testing-library';
@@ -26,7 +25,6 @@ export default defineConfig([
2625

2726
plugins: {
2827
react,
29-
'react-compiler': reactCompiler,
3028
'react-hooks': reactHooks,
3129
'react-x': reactX,
3230
sonarjs,
@@ -383,14 +381,25 @@ export default defineConfig([
383381
'react/style-prop-object': 0,
384382
'react/void-dom-elements-no-children': 1,
385383

386-
// React Compiler
387-
// https://react.dev/learn/react-compiler#installing-eslint-plugin-react-compiler
388-
'react-compiler/react-compiler': 1,
389-
390384
// React Hooks
391385
// https://www.npmjs.com/package/eslint-plugin-react-hooks
392386
'react-hooks/rules-of-hooks': 1,
393387
'react-hooks/exhaustive-deps': 1,
388+
'react-hooks/component-hook-factories': 1,
389+
'react-hooks/config': 1,
390+
'react-hooks/error-boundaries': 1,
391+
'react-hooks/gating': 1,
392+
'react-hooks/globals': 1,
393+
'react-hooks/immutability': 0,
394+
'react-hooks/incompatible-library': 1,
395+
'react-hooks/preserve-manual-memoization': 1,
396+
'react-hooks/purity': 1,
397+
'react-hooks/refs': 1,
398+
'react-hooks/set-state-in-effect': 1,
399+
'react-hooks/set-state-in-render': 1,
400+
'react-hooks/static-components': 1,
401+
'react-hooks/unsupported-syntax': 1,
402+
'react-hooks/use-memo': 1,
394403

395404
// React Hooks Extra
396405
// https://eslint-react.xyz/

‎package.json‎

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -59,14 +59,14 @@
5959
"@faker-js/faker": "^10.0.0",
6060
"@ianvs/prettier-plugin-sort-imports": "^4.6.2",
6161
"@linaria/core": "^6.3.0",
62-
"@tanstack/react-router": "^1.131.26",
63-
"@tanstack/router-plugin": "^1.131.26",
64-
"@types/node": "^24.3.0",
65-
"@types/react": "^19.1.10",
66-
"@types/react-dom": "^19.1.7",
62+
"@tanstack/react-router": "^1.132.31",
63+
"@tanstack/router-plugin": "^1.132.31",
64+
"@types/node": "^24.6.2",
65+
"@types/react": "^19.2.0",
66+
"@types/react-dom": "^19.2.0",
6767
"@typescript-eslint/eslint-plugin": "^8.39.1",
6868
"@typescript-eslint/parser": "^8.39.1",
69-
"@vitejs/plugin-react": "^5.0.0",
69+
"@vitejs/plugin-react": "5.0.2",
7070
"@vitest/browser": "^3.2.4",
7171
"@vitest/coverage-istanbul": "^3.2.4",
7272
"@vitest/eslint-plugin": "^1.3.4",
@@ -75,17 +75,16 @@
7575
"eslint": "^9.36.0",
7676
"eslint-plugin-jest-dom": "^5.5.0",
7777
"eslint-plugin-react": "^7.37.5",
78-
"eslint-plugin-react-compiler": "^19.1.0-rc.2",
79-
"eslint-plugin-react-hooks": "^5.2.0",
78+
"eslint-plugin-react-hooks": "^6.1.0",
8079
"eslint-plugin-sonarjs": "^3.0.5",
8180
"eslint-plugin-testing-library": "^7.10.0",
8281
"jspdf": "^3.0.1",
8382
"jspdf-autotable": "^5.0.2",
8483
"playwright": "^1.54.2",
8584
"postcss": "^8.5.2",
8685
"prettier": "3.6.2",
87-
"react": "^19.1.1",
88-
"react-dom": "^19.1.1",
86+
"react": "^19.2.0",
87+
"react-dom": "^19.2.0",
8988
"rolldown": "^1.0.0-beta.33",
9089
"rolldown-plugin-dts": "^0.16.1",
9190
"typescript": "~5.9.2",
@@ -94,8 +93,8 @@
9493
"vitest-browser-react": "^1.0.1"
9594
},
9695
"peerDependencies": {
97-
"react": "^19.0",
98-
"react-dom": "^19.0"
96+
"react": "^19.2",
97+
"react-dom": "^19.2"
9998
},
10099
"overrides": {
101100
"vite": "$vite"

‎src/EditCell.tsx‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
import { useLayoutEffect, useRef } from 'react';
1+
import { useEffectEvent, useLayoutEffect, useRef } from 'react';
22
import { css } from '@linaria/core';
33

4-
import { useLatestFunc } from './hooks';
54
import { createCellEvent, getCellClassname, getCellStyle, onEditorNavigation } from './utils';
65
import type {
76
CellKeyboardEvent,
@@ -81,7 +80,7 @@ export default function EditCell<R, SR>({
8180
// We need to prevent the `useLayoutEffect` from cleaning up between re-renders,
8281
// as `onWindowCaptureMouseDown` might otherwise miss valid mousedown events.
8382
// To that end we instead access the latest props via useLatestFunc.
84-
const commitOnOutsideMouseDown = useLatestFunc(() => {
83+
const commitOnOutsideMouseDown = useEffectEvent(() => {
8584
onClose(true, false);
8685
});
8786

@@ -123,7 +122,7 @@ export default function EditCell<R, SR>({
123122
removeEventListener('mousedown', onWindowMouseDown);
124123
cancelTask();
125124
};
126-
}, [commitOnOutsideClick, commitOnOutsideMouseDown]);
125+
}, [commitOnOutsideClick]);
127126

128127
function cancelTask() {
129128
captureEventRef.current = undefined;

‎src/hooks/useViewportColumns.ts‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,6 @@ export function useViewportColumns<R, SR>({
3636

3737
const updateStartIdx = (colIdx: number, colSpan: number | undefined) => {
3838
if (colSpan !== undefined && colIdx + colSpan > colOverscanStartIdx) {
39-
// eslint-disable-next-line react-compiler/react-compiler
4039
startIdx = colIdx;
4140
return true;
4241
}

‎website/routeTree.gen.ts‎

Lines changed: 100 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -307,74 +307,74 @@ export interface RootRouteChildren {
307307

308308
declare module '@tanstack/react-router' {
309309
interface FileRoutesByPath {
310-
'/': {
311-
id: '/'
312-
path: '/'
313-
fullPath: '/'
314-
preLoaderRoute: typeof IndexRouteImport
310+
'/VariableRowHeight': {
311+
id: '/VariableRowHeight'
312+
path: '/VariableRowHeight'
313+
fullPath: '/VariableRowHeight'
314+
preLoaderRoute: typeof VariableRowHeightRouteImport
315315
parentRoute: typeof rootRouteImport
316316
}
317-
'/AllFeatures': {
318-
id: '/AllFeatures'
319-
path: '/AllFeatures'
320-
fullPath: '/AllFeatures'
321-
preLoaderRoute: typeof AllFeaturesRouteImport
317+
'/TreeView': {
318+
id: '/TreeView'
319+
path: '/TreeView'
320+
fullPath: '/TreeView'
321+
preLoaderRoute: typeof TreeViewRouteImport
322322
parentRoute: typeof rootRouteImport
323323
}
324-
'/Animation': {
325-
id: '/Animation'
326-
path: '/Animation'
327-
fullPath: '/Animation'
328-
preLoaderRoute: typeof AnimationRouteImport
324+
'/ScrollToCell': {
325+
id: '/ScrollToCell'
326+
path: '/ScrollToCell'
327+
fullPath: '/ScrollToCell'
328+
preLoaderRoute: typeof ScrollToCellRouteImport
329329
parentRoute: typeof rootRouteImport
330330
}
331-
'/CellNavigation': {
332-
id: '/CellNavigation'
333-
path: '/CellNavigation'
334-
fullPath: '/CellNavigation'
335-
preLoaderRoute: typeof CellNavigationRouteImport
331+
'/RowsReordering': {
332+
id: '/RowsReordering'
333+
path: '/RowsReordering'
334+
fullPath: '/RowsReordering'
335+
preLoaderRoute: typeof RowsReorderingRouteImport
336336
parentRoute: typeof rootRouteImport
337337
}
338-
'/ColumnGrouping': {
339-
id: '/ColumnGrouping'
340-
path: '/ColumnGrouping'
341-
fullPath: '/ColumnGrouping'
342-
preLoaderRoute: typeof ColumnGroupingRouteImport
338+
'/RowGrouping': {
339+
id: '/RowGrouping'
340+
path: '/RowGrouping'
341+
fullPath: '/RowGrouping'
342+
preLoaderRoute: typeof RowGroupingRouteImport
343343
parentRoute: typeof rootRouteImport
344344
}
345-
'/ColumnSpanning': {
346-
id: '/ColumnSpanning'
347-
path: '/ColumnSpanning'
348-
fullPath: '/ColumnSpanning'
349-
preLoaderRoute: typeof ColumnSpanningRouteImport
345+
'/ResizableGrid': {
346+
id: '/ResizableGrid'
347+
path: '/ResizableGrid'
348+
fullPath: '/ResizableGrid'
349+
preLoaderRoute: typeof ResizableGridRouteImport
350350
parentRoute: typeof rootRouteImport
351351
}
352-
'/ColumnsReordering': {
353-
id: '/ColumnsReordering'
354-
path: '/ColumnsReordering'
355-
fullPath: '/ColumnsReordering'
356-
preLoaderRoute: typeof ColumnsReorderingRouteImport
352+
'/NoRows': {
353+
id: '/NoRows'
354+
path: '/NoRows'
355+
fullPath: '/NoRows'
356+
preLoaderRoute: typeof NoRowsRouteImport
357357
parentRoute: typeof rootRouteImport
358358
}
359-
'/CommonFeatures': {
360-
id: '/CommonFeatures'
361-
path: '/CommonFeatures'
362-
fullPath: '/CommonFeatures'
363-
preLoaderRoute: typeof CommonFeaturesRouteImport
359+
'/MillionCells': {
360+
id: '/MillionCells'
361+
path: '/MillionCells'
362+
fullPath: '/MillionCells'
363+
preLoaderRoute: typeof MillionCellsRouteImport
364364
parentRoute: typeof rootRouteImport
365365
}
366-
'/ContextMenu': {
367-
id: '/ContextMenu'
368-
path: '/ContextMenu'
369-
fullPath: '/ContextMenu'
370-
preLoaderRoute: typeof ContextMenuRouteImport
366+
'/MasterDetail': {
367+
id: '/MasterDetail'
368+
path: '/MasterDetail'
369+
fullPath: '/MasterDetail'
370+
preLoaderRoute: typeof MasterDetailRouteImport
371371
parentRoute: typeof rootRouteImport
372372
}
373-
'/CustomizableRenderers': {
374-
id: '/CustomizableRenderers'
375-
path: '/CustomizableRenderers'
376-
fullPath: '/CustomizableRenderers'
377-
preLoaderRoute: typeof CustomizableRenderersRouteImport
373+
'/InfiniteScrolling': {
374+
id: '/InfiniteScrolling'
375+
path: '/InfiniteScrolling'
376+
fullPath: '/InfiniteScrolling'
377+
preLoaderRoute: typeof InfiniteScrollingRouteImport
378378
parentRoute: typeof rootRouteImport
379379
}
380380
'/HeaderFilters': {
@@ -384,74 +384,74 @@ declare module '@tanstack/react-router' {
384384
preLoaderRoute: typeof HeaderFiltersRouteImport
385385
parentRoute: typeof rootRouteImport
386386
}
387-
'/InfiniteScrolling': {
388-
id: '/InfiniteScrolling'
389-
path: '/InfiniteScrolling'
390-
fullPath: '/InfiniteScrolling'
391-
preLoaderRoute: typeof InfiniteScrollingRouteImport
387+
'/CustomizableRenderers': {
388+
id: '/CustomizableRenderers'
389+
path: '/CustomizableRenderers'
390+
fullPath: '/CustomizableRenderers'
391+
preLoaderRoute: typeof CustomizableRenderersRouteImport
392392
parentRoute: typeof rootRouteImport
393393
}
394-
'/MasterDetail': {
395-
id: '/MasterDetail'
396-
path: '/MasterDetail'
397-
fullPath: '/MasterDetail'
398-
preLoaderRoute: typeof MasterDetailRouteImport
394+
'/ContextMenu': {
395+
id: '/ContextMenu'
396+
path: '/ContextMenu'
397+
fullPath: '/ContextMenu'
398+
preLoaderRoute: typeof ContextMenuRouteImport
399399
parentRoute: typeof rootRouteImport
400400
}
401-
'/MillionCells': {
402-
id: '/MillionCells'
403-
path: '/MillionCells'
404-
fullPath: '/MillionCells'
405-
preLoaderRoute: typeof MillionCellsRouteImport
401+
'/CommonFeatures': {
402+
id: '/CommonFeatures'
403+
path: '/CommonFeatures'
404+
fullPath: '/CommonFeatures'
405+
preLoaderRoute: typeof CommonFeaturesRouteImport
406406
parentRoute: typeof rootRouteImport
407407
}
408-
'/NoRows': {
409-
id: '/NoRows'
410-
path: '/NoRows'
411-
fullPath: '/NoRows'
412-
preLoaderRoute: typeof NoRowsRouteImport
408+
'/ColumnsReordering': {
409+
id: '/ColumnsReordering'
410+
path: '/ColumnsReordering'
411+
fullPath: '/ColumnsReordering'
412+
preLoaderRoute: typeof ColumnsReorderingRouteImport
413413
parentRoute: typeof rootRouteImport
414414
}
415-
'/ResizableGrid': {
416-
id: '/ResizableGrid'
417-
path: '/ResizableGrid'
418-
fullPath: '/ResizableGrid'
419-
preLoaderRoute: typeof ResizableGridRouteImport
415+
'/ColumnSpanning': {
416+
id: '/ColumnSpanning'
417+
path: '/ColumnSpanning'
418+
fullPath: '/ColumnSpanning'
419+
preLoaderRoute: typeof ColumnSpanningRouteImport
420420
parentRoute: typeof rootRouteImport
421421
}
422-
'/RowGrouping': {
423-
id: '/RowGrouping'
424-
path: '/RowGrouping'
425-
fullPath: '/RowGrouping'
426-
preLoaderRoute: typeof RowGroupingRouteImport
422+
'/ColumnGrouping': {
423+
id: '/ColumnGrouping'
424+
path: '/ColumnGrouping'
425+
fullPath: '/ColumnGrouping'
426+
preLoaderRoute: typeof ColumnGroupingRouteImport
427427
parentRoute: typeof rootRouteImport
428428
}
429-
'/RowsReordering': {
430-
id: '/RowsReordering'
431-
path: '/RowsReordering'
432-
fullPath: '/RowsReordering'
433-
preLoaderRoute: typeof RowsReorderingRouteImport
429+
'/CellNavigation': {
430+
id: '/CellNavigation'
431+
path: '/CellNavigation'
432+
fullPath: '/CellNavigation'
433+
preLoaderRoute: typeof CellNavigationRouteImport
434434
parentRoute: typeof rootRouteImport
435435
}
436-
'/ScrollToCell': {
437-
id: '/ScrollToCell'
438-
path: '/ScrollToCell'
439-
fullPath: '/ScrollToCell'
440-
preLoaderRoute: typeof ScrollToCellRouteImport
436+
'/Animation': {
437+
id: '/Animation'
438+
path: '/Animation'
439+
fullPath: '/Animation'
440+
preLoaderRoute: typeof AnimationRouteImport
441441
parentRoute: typeof rootRouteImport
442442
}
443-
'/TreeView': {
444-
id: '/TreeView'
445-
path: '/TreeView'
446-
fullPath: '/TreeView'
447-
preLoaderRoute: typeof TreeViewRouteImport
443+
'/AllFeatures': {
444+
id: '/AllFeatures'
445+
path: '/AllFeatures'
446+
fullPath: '/AllFeatures'
447+
preLoaderRoute: typeof AllFeaturesRouteImport
448448
parentRoute: typeof rootRouteImport
449449
}
450-
'/VariableRowHeight': {
451-
id: '/VariableRowHeight'
452-
path: '/VariableRowHeight'
453-
fullPath: '/VariableRowHeight'
454-
preLoaderRoute: typeof VariableRowHeightRouteImport
450+
'/': {
451+
id: '/'
452+
path: '/'
453+
fullPath: '/'
454+
preLoaderRoute: typeof IndexRouteImport
455455
parentRoute: typeof rootRouteImport
456456
}
457457
}

0 commit comments

Comments
 (0)