# What changed in react-grid-layout

> 28 changes in react-grid-layout 1 to 2 from its official release notes, upgrade guides and advisories: 9 breaking, 13 new APIs and options. Each one cited. Sources checked 2026-10-18. HTML: https://unstale.sh/npm/react-grid-layout/

To see which of these apply to a repository, run `npx @unstale/cli init` in it.

## react-grid-layout 2

### Breaking changes

- The v2 API requires an explicit layout prop; the data-grid pattern is available only through the legacy wrapper. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Callback parameters are now read-only, so mutations in onResize or onDrag no longer work. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- The callback now fires after 3px of mouse movement instead of on mousedown; use onMouseDown on grid items for immediate response. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Callback parameters are now read-only, so mutations in onResize or onDrag no longer work. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- React 18 is required; React 16 and 17 support is available only through the legacy wrapper. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- The UMD bundle is removed; use a bundler such as Vite, webpack, or esbuild. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds reactive container width measurement with ResizeObserver for supplying the required grid width. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- The prop is removed; use compactType={null} or compactor={noCompactor} instead. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- The grid now requires an explicit width prop and no longer measures its width automatically; use useContainerWidth or the legacy wrapper. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)

### New APIs and options

- Adds a utility for building custom grid overlays. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds a pluggable interface for custom compaction algorithms; the default algorithm remains the same as v1. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds a focused configuration prop for grouping related drag settings. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- An optional O(n log n) fast compactor is available for large layouts of 200 or more items. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds an optional component for visualizing the grid structure. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds a focused configuration prop for grouping related grid settings. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds an interface for controlling CSS positioning. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds a framework-agnostic entry point for core utilities that does not require React. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds an optional entry point for extras including GridBackground and fastVerticalCompactor. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Provides the v1 API with backwards compatibility, including support for the legacy width and data-grid patterns. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds a focused configuration prop for grouping related resize settings. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds core layout state management for custom implementations. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Adds responsive breakpoint management through a hook. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)

### Tooling

- Adds first-class TypeScript types, so @types/react-grid-layout is no longer needed. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)

### Fixes and other changes

- Fixes an operator precedence bug that incorrectly made shouldDrag true when only the top position changed. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- Fixes resize position calculation when node is falsy. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)
- The library now works with React 18 automatic batching without flushSync warnings. (2.0.0) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/2.0.0)

## react-grid-layout 1

### Performance

- The bottom calculation is cached to improve compaction performance. (1.5.3) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/1.5.3)

### Fixes and other changes

- Collision detection now uses the correct y-coordinates, avoiding incorrect collision results. (1.5.3) — [release notes](https://github.com/react-grid-layout/react-grid-layout/releases/tag/1.5.3)
