{"_id":"@eleung/react-grid-layout","_rev":"21-d6de899fb5c879f8c988fce53d41254f","name":"@eleung/react-grid-layout","dist-tags":{"latest":"1.8.3"},"versions":{"1.6.0":{"name":"@eleung/react-grid-layout","version":"1.6.0","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.0","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"954a4030a3ff934b80de4ad609a3d73066242c3c","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.0.tgz","fileCount":47,"integrity":"sha512-IUq5dd80OXpcnAeqqAfIaUljU1lMKxM6rTkDzt87w054Hnh55fUb5sJE2ggbSFnm4YzyK73C0dbT9DVlRp9wkg==","signatures":[{"sig":"MEUCIQCJ+OkGwqGAtK73u8rBimOtN8xbBmEmU9hNRgCEDeoY2QIgbjNRsrkXC3axw63JfRBG+0xCyqFHpxn7113vC/xs4FQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":847298},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"3c29633173cd7a53a833405ae46f19486fbab4d4","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.0_1760928696022_0.0046930676444196795","host":"s3://npm-registry-packages-npm-production"}},"1.6.1":{"name":"@eleung/react-grid-layout","version":"1.6.1","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.1","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"3e4315b54c3e4bce41d265c1f8fbdebc92b94681","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.1.tgz","fileCount":47,"integrity":"sha512-TQGWFeY0/ikfj5BPWRrfVW3rBnWlHAgqAa6gdC8gtMKcKbBTcdAliLvMhE3vxrJRb6WnvEzo5/3pQtgz4kcfcA==","signatures":[{"sig":"MEQCIA1+06PAtVof/qpWywTTsKl3m2GGfWeipMYcLK+THpcXAiBIXgQFm5VDEt0PVqJ/QyKBw3hC1EvgF1OAs8sB1n21Rg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":849026},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"a8070fab17a796adfc7daeec36a4074bf0a8185a","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.1_1760929091974_0.8032808286831781","host":"s3://npm-registry-packages-npm-production"}},"1.6.2":{"name":"@eleung/react-grid-layout","version":"1.6.2","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.2","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"0e85159851a7b774f6cb8026b8743f3b081b93b7","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.2.tgz","fileCount":47,"integrity":"sha512-SYlv2UdNm6sZGmppPWfJZsDrmysTIb7HdCyySYWOY+5Jq80IJT6FMyE9asQzmIIe9bYF1HBnU+nAssACmZcztw==","signatures":[{"sig":"MEUCIFscV2/hgaeaLjAfPmoIigLlJ0VC7q/vFxLLYLpDutlxAiEA6lf2uhR4ZwvfFBW4sWTIY8UYhTcTO3TezVz1PMtrV4o=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":864067},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"27d3dab73046827f8db683f8799d7e39ac88a9e3","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.2_1760964449068_0.8414505884094619","host":"s3://npm-registry-packages-npm-production"}},"1.6.3":{"name":"@eleung/react-grid-layout","version":"1.6.3","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.3","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"1f8915c13e9651e9573bfc5d322ae77f16aaf2ce","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.3.tgz","fileCount":47,"integrity":"sha512-3LF5pfQ3gGRYmvA0E35gSmCBdRYtaOw/ywqjYDIxYqX7v3OuW0ns6+LxltF02r8lxVp377Gw5AZxsJ6bQQWNYA==","signatures":[{"sig":"MEYCIQDVPc9lAyElZcfG7ZTTx8NzZfx2+YPr2kujIA4dKJrEPwIhAO8jof9AzsuPwo0E8oOe4ASakPbd3yaOPUa5ywD5rO0F","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":862070},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"00a6f51f8ef3d4c26b97a6421d9c39416e7cc5bc","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.3_1761045875007_0.49450486983926","host":"s3://npm-registry-packages-npm-production"}},"1.6.4":{"name":"@eleung/react-grid-layout","version":"1.6.4","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.4","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"eba4d4998c9194d3355879fec8da8b2adf15bf59","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.4.tgz","fileCount":47,"integrity":"sha512-kjHJooxP959xhphs1qdVRyKit10jYsInimiugSzQeY0UF8BcgJ+WJ6yTL6OED5S55n5OaUslCWF6t63FtOL+Ug==","signatures":[{"sig":"MEUCIQDuqzUy9SnYiQ2hObAJSGW4PXSJXq7ZVKutid4KY/+xMgIgLEv2WoO3djbHwCqEe6TDSrqWNQoE7yTaOHYw4y3uduE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":863321},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"eaee3f3ea6d1fa284426d72e4d5eefd95793252a","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.4_1761098366524_0.44263117677697905","host":"s3://npm-registry-packages-npm-production"}},"1.6.5":{"name":"@eleung/react-grid-layout","version":"1.6.5","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.5","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"bfd619998670d7f877ba551e69a1cdab2a6227b4","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.5.tgz","fileCount":47,"integrity":"sha512-94YZL20CqQvRTd26HP7RZmK0NmlYhjgsndjwFtcH8+v5bZmtJBWInt6JBYCnjoA4yzpUadqr/d5u4VXXuRT9+Q==","signatures":[{"sig":"MEUCIHxK79MZM7xHVR/ju2DlOd2ot4GVhkKF3/LU9eAIIHAXAiEAksYCb6wkIkuGXVCbZw9zOzceWczHjNiF3MHOYBbrqOU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":868254},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"30c6ef9c4eee6b3893a2aec7f93abbe7de20ec6a","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.5_1761274284512_0.4268947006713817","host":"s3://npm-registry-packages-npm-production"}},"1.6.6":{"name":"@eleung/react-grid-layout","version":"1.6.6","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.6","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"fa0df1a8df557e85a87eab946a0721dde8230dc0","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.6.tgz","fileCount":47,"integrity":"sha512-gPTuVZ8I4PvlyHptvP+/I+k0TLqXdufIw6ffZM1Dg6KshIPUD3ufcMZ1OSBLEr/+Cp8QgVFXfGvD4LJrjGHb4w==","signatures":[{"sig":"MEUCIFAc8SKOeSwf26m6fyi6+6xPxqv+VAKySkbp5JyHnawcAiEAv69IJIsIfHTmIhmzObgfG/t28PYr/afLraLI9D3kKXk=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":868230},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"e9e65b9c103835d152451ec57f7e5f733d2d7c3c","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.6_1762133393900_0.5051504461219511","host":"s3://npm-registry-packages-npm-production"}},"1.6.7":{"name":"@eleung/react-grid-layout","version":"1.6.7","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.7","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"1626114ef740a5ae817dd5de9ff1d9a797c4b8e2","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.7.tgz","fileCount":47,"integrity":"sha512-lr0PJwtGXP34IM30YrSkFSi4/ItylAcu2UokRhBXlbAXdIAFs05hVk421C1DlVDOMRxkbVkkuIS70ka5SrW/LA==","signatures":[{"sig":"MEQCIHKvXzv8WwQcBsQLH8BZHmecO/xBApy0QrqVZFGuKMUGAiBmOd85TNjUDJ/Y7nW/qgFXzErgz+Jrv0juLmMB/lDKkQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":868869},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"5219bf58fcd070a984cfc0aeb5a7d17fc753e71c","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.7_1762153016380_0.5898392540150756","host":"s3://npm-registry-packages-npm-production"}},"1.6.8":{"name":"@eleung/react-grid-layout","version":"1.6.8","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.8","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"779118fddb28d55d5772928653c2cc8def7f246e","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.8.tgz","fileCount":47,"integrity":"sha512-8GDgqYkBNwISFiHJnzdoB4lbbLcQ9Ga9sYzRQ4INFpnd9h61Bcm2dyyRwrdoUjNcJWyHVL3hYTslKU1zzvVSwg==","signatures":[{"sig":"MEQCICrmNweYrnH/F5XpIyaB7gJKMm+pKkWysTrxnSJQhdVrAiB+6g8P6CAhsHIxuqoaEab8aZcCV6lYbYCsmIDSB6PU1Q==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":872330},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"67e03ae7be93c74f22239b4af2edae7141362251","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.8_1762169308281_0.6074370754000082","host":"s3://npm-registry-packages-npm-production"}},"1.6.10":{"name":"@eleung/react-grid-layout","version":"1.6.10","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.10","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"cadc0646a36a47baeca1897b5aecaa449f266282","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.10.tgz","fileCount":47,"integrity":"sha512-hlF5if4Gwv+bt2nM3Jy9C/a3kcMcBCL0IhDz8DSrWV6tmEghniKHrjEL6oM+ecuRjsE+FAAKvi8UjswX0wlrQg==","signatures":[{"sig":"MEUCIHGQsojmlQMxWEdittl135lHHzwIJH0FYxZ7/tUMocNSAiEAgpuqMacSrArGXAXp2nTkcnD7qrxJi1SKmaxTKh8ICfE=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":873280},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"1a83c332bae9ef72c2f8ce9fb49e12a374fde5cb","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.10_1762174278941_0.7582572219562835","host":"s3://npm-registry-packages-npm-production"}},"1.6.11":{"name":"@eleung/react-grid-layout","version":"1.6.11","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.11","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"fc47f4e0145b8d8059b0693239b6e7bdfd344c64","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.11.tgz","fileCount":47,"integrity":"sha512-a0RvI7CbC+CRVgZYE13CVoCaLJLhBpEHjjVv+9Cg1AXfUw0K1wFYyTTTuEqXavcWGm/n5KCyb0nDOvuEvN++iA==","signatures":[{"sig":"MEUCIQCC3JG7scZKgA2p5BIIfMMGzvGBmm266n8lxB2LvlkKfgIgTM1j49PLNCItoZza3cq4Pr/K9CUzTElifGSw3DMU5oc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":885772},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"ee90ef44401a294fe0c9da00fb2b52077873ef47","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.11_1762175935753_0.1407188740990819","host":"s3://npm-registry-packages-npm-production"}},"1.6.12":{"name":"@eleung/react-grid-layout","version":"1.6.12","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.12","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"69d99e36c8e7368b7aeeb5fc418f4776f47fc354","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.12.tgz","fileCount":47,"integrity":"sha512-CCAcUvn3bcWAr8JAsOP1/uT3qdLVtJwfvfSOTBbIcoWkzSA/g6khruAFHbkPd7sAYjOCBjF3GvBVJ6tPcgOsow==","signatures":[{"sig":"MEUCIQCYHd09mSQiFTCbJZoTOjuYJUP7qQnlaX02EYU9YUKphwIgFZPTalo4auIoj8Iba7sml9lv0SP4RWbHo9Kqwhwjxwo=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":885701},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"2e778448b4cd5a0e4c96c089443ab330dfd79836","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.12_1762318492845_0.8244584501272831","host":"s3://npm-registry-packages-npm-production"}},"1.6.13":{"name":"@eleung/react-grid-layout","version":"1.6.13","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.6.13","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"c3802f4c9929e0ce6d290b9159a745cd6669c06a","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.6.13.tgz","fileCount":47,"integrity":"sha512-qgLBgMpd+xqxFFfbCYwn9ZDgMXF1Qm6SxybAPXBWq9Clnesi2yyVBd7zH7Mer56/3uE1FfFqc82ZRwnAPSi3kg==","signatures":[{"sig":"MEQCIGI543k+1Qnhq6fvigBjaV8ddMnGgoUQJnBDezXTaOw7AiA0T3/PVrb5i5J2nLXFLPnshyK1bpq+KyrQemrcf2biZg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":885989},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"273bc0fef2f80b5de104a5e5a7617b8f8390cad4","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.6.13_1762390374094_0.4061135519091923","host":"s3://npm-registry-packages-npm-production"}},"1.7.0":{"name":"@eleung/react-grid-layout","version":"1.7.0","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.7.0","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"ecfd349682e52fc3dd503fb0650f195fc7e9c681","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.7.0.tgz","fileCount":47,"integrity":"sha512-SjmxaO3kBukHqQVJ/jnWJoY1HPJsdxhg8maMeh2sR/33iS6xgArM3uviBz04bP4N2MPPcBIf13o6v2UWIlJdMw==","signatures":[{"sig":"MEUCIEYDyjOfJUXCB43TnxE/D9LBJCQuNfwsx0d6ICtYxmrfAiEA1Z3UPOYMkRdQnR6188VCkbulTdDuAsNbZ7cRQGaMPX0=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":898476},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"57d3e68b497cc444fefcc085c09140600d892456","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.7.0_1766056306254_0.10149412321206053","host":"s3://npm-registry-packages-npm-production"}},"1.7.1":{"name":"@eleung/react-grid-layout","version":"1.7.1","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.7.1","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"616b3b2ce513b5ca08a4a13f21e5d45acea42ffe","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.7.1.tgz","fileCount":47,"integrity":"sha512-7MrezJwiDp4kR8yujWqpRHoFZ3IJrAKJY/iNvTxgiGaHNJ84oQCQdqBhot4gGQbsZBBCKPaSnckUJ9YZRvpkvA==","signatures":[{"sig":"MEYCIQCj9cTVTlKHlvT4Udq1JYWIGMf51xk9bfeYVB+W0ZdSsAIhAJroEaRyfdCZUCyS/4Ejn2CDQLmdz+LQPqXA7RErW4nY","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":900213},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"a7bbc4ca774b9513ae391fcb8e34063b0e422543","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.7.1_1766124965883_0.26090409717431395","host":"s3://npm-registry-packages-npm-production"}},"1.8.0":{"name":"@eleung/react-grid-layout","version":"1.8.0","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.8.0","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"6fe40468b2b59acf69a86707ebfcb00dcc078be5","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.8.0.tgz","fileCount":47,"integrity":"sha512-2Z5tOA7y1aefnnanHdK7bJV7AjqnBJ1X153sQMQi8WgXJI9D5fxUBxE/P4hpTSmne9CmO/X4SgpXiSNGV7TbqA==","signatures":[{"sig":"MEYCIQCkNxxPqvrgX1Ja9izoNVm7XYfokbpAYjXMAniP/7uykAIhAP5sDwOxzULqfT7iYT6dulHR4+OqcCzzKNRjRKD51Aqy","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":914160},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"f7e4ae899409cd6cd7169e36e657c1799c74c1df","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.8.0_1768274761026_0.04200097918015855","host":"s3://npm-registry-packages-npm-production"}},"1.8.1":{"name":"@eleung/react-grid-layout","version":"1.8.1","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.8.1","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"949b402a4174a716944871481091be3a757d3c19","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.8.1.tgz","fileCount":47,"integrity":"sha512-wEqp0WRzOMWbE0MS1DxS9zNjXSH7V4sMxRXzEUbpZNdni3sLc/r/eaWcag+Ndo4KgG0qYLLro8KiqJ0e10a7FQ==","signatures":[{"sig":"MEYCIQCxxdBp6kGkPy6Kn8SGEhZlq0NbSeEqfNKoV5H7nuCrDwIhAPTe5+hzJEOnp8082r91hPWyvh3vZHB2ICjoN84qy4y0","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":916271},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"74b5741c8f01cf346bba9a6db66525bff8d9f43a","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.8.1_1768348690592_0.44900273832673787","host":"s3://npm-registry-packages-npm-production"}},"1.8.2":{"name":"@eleung/react-grid-layout","version":"1.8.2","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"url":"http://strml.net/","name":"Samuel Reed","email":"samuel.trace.reed@gmail.com"},"license":"MIT","_id":"@eleung/react-grid-layout@1.8.2","maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"contributors":[{"name":"Edmond Leung","email":"eleung"}],"homepage":"https://github.com/eleung/react-grid-layout","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"dist":{"shasum":"b37a020ad149d3ea5be73cb5fae09870c79feaff","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.8.2.tgz","fileCount":47,"integrity":"sha512-xACMa2dtoI76ZeWj8w9h/aKhKmZem8QwOKZGwRAxk+tSblpbdND5o8KzDQDBqcWaJnb1SI691Y1BsfikrM0cFQ==","signatures":[{"sig":"MEYCIQDNQu+B0w++9iGdRkSds1NZZWlDCp+poS8TbYtAGRfPGAIhAKXNIKJrU0FhzIH2ge3OMPqixR3lyrsEG3lf43s5/Uyk","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":917137},"jest":{"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","coverageThreshold":{"global":{"lines":78,"branches":72,"functions":77,"statements":77}},"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testEnvironmentOptions":{"url":"http://localhost"}},"main":"index.js","gitHead":"f3b8b9664b63ede9169232340371dbdfe850cefc","scripts":{"dev":"make dev","fmt":"prettier --write .","flow":"flow","lint":"make lint","test":"make test","build":"make build","validate":"npm ls","fmt:check":"prettier --check .","view-example":"make view-example","build-example":"make build-example","prepublishOnly":"make build"},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"repository":{"url":"git+ssh://git@github.com/eleung/react-grid-layout.git","type":"git"},"_npmVersion":"11.4.2","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","directories":{},"lint-staged":{"*":["prettier --ignore-unknown --write"],"*.{js,jsx}":["eslint --ext .js,.jsx --fix"]},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"_nodeVersion":"22.14.0","dependencies":{"clsx":"^2.1.1","prop-types":"^15.8.1","fast-equals":"^4.0.3","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"_hasShrinkwrap":false,"devDependencies":{"ejs":"^3.1.10","jest":"^29.7.0","husky":"^8.0.3","react":"^16.13.1","enzyme":"^3.11.0","eslint":"^8.54.0","lodash":"^4.17.21","opener":"^1.5.2","timsort":"^0.3.0","webpack":"^5.89.0","flow-bin":"^0.172.0","prettier":"^3.1.0","react-dom":"^16.13.1","@babel/cli":"^7.27.2","babel-jest":"^29.7.0","css-loader":"^6.8.1","@babel/core":"^7.27.4","lint-staged":"^15.1.0","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^3.3.3","enzyme-to-json":"^3.6.2","exports-loader":"^4.0.0","imports-loader":"^4.0.1","@babel/register":"^7.27.1","react-hot-loader":"^4.13.1","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@webpack-cli/serve":"^2.0.5","webpack-dev-server":"^4.15.1","@babel/preset-react":"^7.27.1","babel-plugin-preval":"^5.1.0","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","react-transform-hmr":"^1.0.2","@babel/eslint-parser":"^7.27.5","eslint-plugin-unicorn":"^49.0.0","eslint-plugin-flowtype":"^8.0.3","jest-environment-jsdom":"^29.7.0","enzyme-adapter-react-16":"^1.15.8","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/plugin-transform-class-properties":"^7.18.6"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"_npmOperationalInternal":{"tmp":"tmp/react-grid-layout_1.8.2_1768350408383_0.4820032180446645","host":"s3://npm-registry-packages-npm-production"}},"1.8.3":{"name":"@eleung/react-grid-layout","version":"1.8.3","description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","main":"index.js","scripts":{"lint":"make lint","test":"make test","build":"make build","build-example":"make build-example","view-example":"make view-example","dev":"make dev","prepublishOnly":"make build","validate":"npm ls","flow":"flow","fmt":"prettier --write .","fmt:check":"prettier --check ."},"repository":{"type":"git","url":"git+ssh://git@github.com/eleung/react-grid-layout.git"},"keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"author":{"name":"Samuel Reed","email":"samuel.trace.reed@gmail.com","url":"http://strml.net/"},"contributors":[{"name":"Edmond Leung","email":"eleung"}],"license":"MIT","bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"homepage":"https://github.com/eleung/react-grid-layout","dependencies":{"clsx":"^2.1.1","fast-equals":"^4.0.3","prop-types":"^15.8.1","react-draggable":"^4.4.6","react-resizable":"^3.0.5","resize-observer-polyfill":"^1.5.1"},"devDependencies":{"@babel/cli":"^7.27.2","@babel/core":"^7.27.4","@babel/eslint-parser":"^7.27.5","@babel/plugin-transform-class-properties":"^7.18.6","@babel/plugin-transform-flow-comments":"^7.27.3","@babel/preset-env":"^7.27.2","@babel/preset-flow":"^7.27.1","@babel/preset-react":"^7.27.1","@babel/register":"^7.27.1","@webpack-cli/serve":"^2.0.5","babel-jest":"^29.7.0","babel-loader":"^9.1.3","babel-plugin-preval":"^5.1.0","css-loader":"^6.8.1","ejs":"^3.1.10","enzyme":"^3.11.0","enzyme-adapter-react-16":"^1.15.8","enzyme-to-json":"^3.6.2","eslint":"^8.54.0","eslint-plugin-flowtype":"^8.0.3","eslint-plugin-mocha":"^10.2.0","eslint-plugin-react":"^7.33.2","eslint-plugin-unicorn":"^49.0.0","exports-loader":"^4.0.0","flow-bin":"^0.172.0","husky":"^8.0.3","imports-loader":"^4.0.1","jest":"^29.7.0","jest-environment-jsdom":"^29.7.0","lint-staged":"^15.1.0","lodash":"^4.17.21","opener":"^1.5.2","prettier":"^3.1.0","react":"^16.13.1","react-dom":"^16.13.1","react-hot-loader":"^4.13.1","react-transform-hmr":"^1.0.2","style-loader":"^3.3.3","timsort":"^0.3.0","webpack":"^5.89.0","webpack-cli":"^5.1.4","webpack-dev-server":"^4.15.1"},"resolutions":{"**/cheerio":"npm:cheerio@1.0.0-rc.12"},"peerDependencies":{"react":">= 16.3.0","react-dom":">= 16.3.0"},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org"},"jest":{"setupFilesAfterEnv":["<rootDir>test/util/setupTests.js"],"snapshotSerializers":["enzyme-to-json/serializer"],"testMatch":["<rootDir>/test/spec/*.js"],"testEnvironment":"jsdom","testEnvironmentOptions":{"url":"http://localhost"},"coverageThreshold":{"global":{"statements":77,"branches":72,"functions":77,"lines":78}}},"lint-staged":{"*.{js,jsx}":["eslint --ext .js,.jsx --fix"],"*":["prettier --ignore-unknown --write"]},"_id":"@eleung/react-grid-layout@1.8.3","gitHead":"08a9e3d7a7cd953e9450015c28dc2616a2ca55f2","_nodeVersion":"22.14.0","_npmVersion":"11.4.2","dist":{"integrity":"sha512-B2AxqkmErpbqcGdl7a6Du2T1yWF3R35836x5sWA8AJsUnLi07cIN1GedgYYuHEY4L2Nng6E+JPFrMt625YejxQ==","shasum":"443e7faac5a24bd5558b98449edbb11dd0620260","tarball":"https://registry.npmjs.org/@eleung/react-grid-layout/-/react-grid-layout-1.8.3.tgz","fileCount":47,"unpackedSize":917582,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIE1SDF9MQ3jHTlndIQaflEGSWDelrgAgUpbT59QSqDE6AiA50ZLZp7L8uKR9p0KUR4/wS6YqW4Jtk9FJ/FbhTMjNXQ=="}]},"_npmUser":{"name":"eleung","email":"leung.edmond@gmail.com"},"directories":{},"maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-grid-layout_1.8.3_1768370950814_0.03626507816220581"},"_hasShrinkwrap":false}},"time":{"created":"2025-10-20T02:51:35.878Z","modified":"2026-01-14T06:09:11.142Z","1.6.0":"2025-10-20T02:51:36.297Z","1.6.1":"2025-10-20T02:58:12.227Z","1.6.2":"2025-10-20T12:47:29.276Z","1.6.3":"2025-10-21T11:24:35.178Z","1.6.4":"2025-10-22T01:59:26.769Z","1.6.5":"2025-10-24T02:51:24.772Z","1.6.6":"2025-11-03T01:29:54.125Z","1.6.7":"2025-11-03T06:56:56.606Z","1.6.8":"2025-11-03T11:28:28.499Z","1.6.9":"2025-11-03T11:53:17.132Z","1.6.10":"2025-11-03T12:51:19.137Z","1.6.11":"2025-11-03T13:18:55.932Z","1.6.12":"2025-11-05T04:54:53.098Z","1.6.13":"2025-11-06T00:52:54.386Z","1.7.0":"2025-12-18T11:11:46.401Z","1.7.1":"2025-12-19T06:16:06.093Z","1.8.0":"2026-01-13T03:26:01.237Z","1.8.1":"2026-01-13T23:58:10.770Z","1.8.2":"2026-01-14T00:26:48.534Z","1.8.3":"2026-01-14T06:09:11.012Z"},"bugs":{"url":"https://github.com/eleung/react-grid-layout/issues"},"author":{"name":"Samuel Reed","email":"samuel.trace.reed@gmail.com","url":"http://strml.net/"},"license":"MIT","homepage":"https://github.com/eleung/react-grid-layout","keywords":["react","grid","drag","draggable","resize","resizable","fluid","responsive","flexbox","flex-layout","cross-grid-drag","cross-layout-drag"],"repository":{"type":"git","url":"git+ssh://git@github.com/eleung/react-grid-layout.git"},"description":"A draggable and resizable grid layout with responsive breakpoints, for React. Includes Flexbox layout support and cross-layout drag and drop.","contributors":[{"name":"Edmond Leung","email":"eleung"}],"maintainers":[{"name":"eleung","email":"leung.edmond@gmail.com"}],"readme":"# React-Grid-Layout\n\n[![travis build](https://travis-ci.org/STRML/react-grid-layout.svg?branch=master)](https://travis-ci.org/STRML/react-grid-layout)\n[![CDNJS](https://img.shields.io/cdnjs/v/react-grid-layout.svg)](https://cdnjs.com/libraries/react-grid-layout)\n[![npm package](https://img.shields.io/npm/v/react-grid-layout.svg?style=flat-square)](https://www.npmjs.org/package/react-grid-layout)\n[![npm downloads](https://img.shields.io/npm/dt/react-grid-layout.svg?maxAge=2592000)]()\n\nReact-Grid-Layout is a grid layout system much like [Packery](http://packery.metafizzy.co/) or\n[Gridster](http://dsmorse.github.io/gridster.js/), for React.\n\nUnlike those systems, it is responsive and supports breakpoints. Breakpoint layouts can be provided by the user\nor autogenerated.\n\nRGL is React-only and does not require jQuery.\n\n![BitMEX UI](http://i.imgur.com/oo1NT6c.gif)\n\n> GIF from production usage on [BitMEX.com](https://www.bitmex.com)\n\n[**[Demo](https://eleung.github.io/react-grid-layout/) | [Changelog](/CHANGELOG.md) | [CodeSandbox Editable demo](https://codesandbox.io/s/5wy3rz5z1x?module=%2Fsrc%2FShowcaseLayout.js)**]\n\n## Table of Contents\n\n- [Demos](#demos)\n- [Features](#features)\n- [Installation](#installation)\n- [Usage](#usage)\n- [Drag and Drop Usage](#drag-and-drop-usage)\n  - [Cross-Grid Drag and Drop](#cross-grid-drag-and-drop)\n  - [External Droppable Containers](#external-droppable-containers)\n  - [Cross-Layout Drag and Drop (Grid ↔ Flex)](#cross-layout-drag-and-drop-grid--flex)\n- [Responsive Usage](#responsive-usage)\n- [Flex Layout Usage](#flex-layout-usage)\n- [Providing Grid Width](#providing-grid-width)\n- [Grid Layout Props](#grid-layout-props)\n- [Droppable Props](#droppable-props)\n- [Responsive Grid Layout Props](#responsive-grid-layout-props)\n- [Grid Item Props](#grid-item-props)\n- [Flex Layout Props](#flex-layout-props)\n- [Flex Item Props](#flex-item-props)\n- [User Recipes](../../wiki/Users-recipes)\n- [Performance](#performance)\n- [Contribute](#contribute)\n- [TODO List](#todo-list)\n\n## Demos\n\n1. [Showcase](https://eleung.github.io/react-grid-layout/examples/00-showcase.html)\n1. [Basic](https://eleung.github.io/react-grid-layout/examples/01-basic.html)\n1. [No Dragging/Resizing (Layout Only)](https://eleung.github.io/react-grid-layout/examples/02-no-dragging.html)\n1. [Messy Layout Autocorrect](https://eleung.github.io/react-grid-layout/examples/03-messy.html)\n1. [Layout Defined on Children](https://eleung.github.io/react-grid-layout/examples/04-grid-property.html)\n1. [Static Elements](https://eleung.github.io/react-grid-layout/examples/05-static-elements.html)\n1. [Adding/Removing Elements](https://eleung.github.io/react-grid-layout/examples/06-dynamic-add-remove.html)\n1. [Saving Layout to LocalStorage](https://eleung.github.io/react-grid-layout/examples/07-localstorage.html)\n1. [Saving a Responsive Layout to LocalStorage](https://eleung.github.io/react-grid-layout/examples/08-localstorage-responsive.html)\n1. [Minimum and Maximum Width/Height](https://eleung.github.io/react-grid-layout/examples/09-min-max-wh.html)\n1. [Dynamic Minimum and Maximum Width/Height](https://eleung.github.io/react-grid-layout/examples/10-dynamic-min-max-wh.html)\n1. [No Vertical Compacting (Free Movement)](https://eleung.github.io/react-grid-layout/examples/11-no-vertical-compact.html)\n1. [Prevent Collision](https://eleung.github.io/react-grid-layout/examples/12-prevent-collision.html)\n1. [Error Case](https://eleung.github.io/react-grid-layout/examples/13-error-case.html)\n1. [Toolbox](https://eleung.github.io/react-grid-layout/examples/14-toolbox.html)\n1. [Drag From Outside](https://eleung.github.io/react-grid-layout/examples/15-drag-from-outside.html)\n1. [Bounded Layout](https://eleung.github.io/react-grid-layout/examples/16-bounded.html)\n1. [Responsive Bootstrap-style Layout](https://eleung.github.io/react-grid-layout/examples/17-responsive-bootstrap-style.html)\n1. [Scaled Containers](https://eleung.github.io/react-grid-layout/examples/18-scale.html)\n1. [Allow Overlap](https://eleung.github.io/react-grid-layout/examples/19-allow-overlap.html)\n1. [All Resizable Handles](https://eleung.github.io/react-grid-layout/examples/20-resizable-handles.html)\n1. [Single Row Horizontal](https://eleung.github.io/react-grid-layout/examples/21-horizontal.html)\n1. [Cross-Grid Drag and Drop](https://eleung.github.io/react-grid-layout/examples/22-cross-grid-drag.html)\n1. [External Droppable Containers](https://eleung.github.io/react-grid-layout/examples/23-external-droppable.html)\n1. [Basic Flex Layout](https://eleung.github.io/react-grid-layout/examples/24-basic-flex.html)\n1. [Flex Layout Directions](https://eleung.github.io/react-grid-layout/examples/25-flex-directions.html)\n1. [Grid ↔ Flex Drag and Drop](https://eleung.github.io/react-grid-layout/examples/26-grid-flex-drag.html)\n1. [Flex ↔ Flex + Droppable](https://eleung.github.io/react-grid-layout/examples/27-flex-droppable.html)\n1. [Comprehensive Drag & Drop](https://eleung.github.io/react-grid-layout/examples/28-comprehensive-drag.html)\n1. [Data-Flex Attributes](https://eleung.github.io/react-grid-layout/examples/29-data-flex.html)\n1. [Flex Layout (No Dragging)](https://eleung.github.io/react-grid-layout/examples/30-flex-no-dragging.html)\n1. [Flex Layout-Driven Rendering](https://eleung.github.io/react-grid-layout/examples/31-flex-layout-driven.html)\n1. [Nested Containers](https://eleung.github.io/react-grid-layout/examples/32-nested-containers.html)\n\n#### Projects Using React-Grid-Layout\n\n- [BitMEX](https://www.bitmex.com/)\n- [AWS CloudFront Dashboards](https://aws.amazon.com/blogs/aws/cloudwatch-dashboards-create-use-customized-metrics-views/)\n- [Grafana](https://grafana.com/)\n- [Metabase](http://www.metabase.com/)\n- [HubSpot](http://www.hubspot.com)\n- [ComNetViz](http://www.grotto-networking.com/ComNetViz/ComNetViz.html)\n- [Stoplight](https://app.stoplight.io)\n- [Reflect](https://reflect.io)\n- [ez-Dashing](https://github.com/ylacaute/ez-Dashing)\n- [Kibana](https://www.elastic.co/products/kibana)\n- [Graphext](https://graphext.com/)\n- [Monday](https://support.monday.com/hc/en-us/articles/360002187819-What-are-the-Dashboards-)\n- [Quadency](https://quadency.com/)\n- [Hakkiri](https://www.hakkiri.io)\n- [Ubidots](https://help.ubidots.com/en/articles/2400308-create-dashboards-and-widgets)\n- [Statsout](https://statsout.com/)\n- [Datto RMM](https://www.datto.com/uk/products/rmm/)\n- [SquaredUp](https://squaredup.com/)\n\n_Know of others? Create a PR to let me know!_\n\n## Features\n\n- 100% React - no jQuery\n- Compatible with server-rendered apps\n- Draggable widgets\n- Resizable widgets\n- Static widgets\n- Configurable packing: horizontal, vertical, or off\n- Bounds checking for dragging and resizing\n- Widgets may be added or removed without rebuilding grid\n- Layout can be serialized and restored\n- Responsive breakpoints\n- Separate layouts per responsive breakpoint\n- **Drag and drop between grids** - Drag items between multiple grid instances\n- **External droppable containers** - Drag items to custom drop zones outside grids\n- **Flex layout support** - Alternative layout system using CSS Flexbox\n  - Draggable flex items with smooth reordering\n  - Full flexbox property support (direction, justifyContent, alignItems, gap)\n  - Individual flex item properties (order, grow, shrink, alignSelf)\n  - Visual feedback and animations during drag\n- **Cross-layout drag and drop** - Drag items between grids and flex layouts seamlessly\n  - Automatic item transformation between coordinate systems\n  - Grid ↔ Grid, Flex ↔ Flex, Grid ↔ Flex all supported\n  - Smart constraint conversion (minW/maxW ↔ minWidth/maxWidth)\n  - Smooth visual feedback with insertion indicators (no layout shifts during drag)\n  - Nested container support with proper target detection\n- Grid Items placed using CSS Transforms\n  - Performance with CSS Transforms: [on](http://i.imgur.com/FTogpLp.jpg) / [off](http://i.imgur.com/gOveMm8.jpg), note paint (green) as % of time\n- Compatibility with `<React.StrictMode>`\n\n| Version      | Compatibility   |\n| ------------ | --------------- |\n| >= 0.17.0    | React 16 & 17   |\n| >= 0.11.3    | React 0.14 & 15 |\n| >= 0.10.0    | React 0.14      |\n| 0.8. - 0.9.2 | React 0.13      |\n| < 0.8        | React 0.12      |\n\n## Installation\n\nInstall the React-Grid-Layout [package](https://www.npmjs.org/package/react-grid-layout) using [npm](https://www.npmjs.com/):\n\n```bash\nnpm install react-grid-layout\n```\n\nInclude the following stylesheets in your application:\n\n```\n/node_modules/react-grid-layout/css/styles.css\n/node_modules/react-resizable/css/styles.css\n```\n\n## Usage\n\nUse ReactGridLayout like any other component. The following example below will\nproduce a grid with three items where:\n\n- users will not be able to drag or resize item `a`\n- item `b` will be restricted to a minimum width of 2 grid blocks and a maximum width of 4 grid blocks\n- users will be able to freely drag and resize item `c`\n\n```js\nimport GridLayout from \"react-grid-layout\";\n\nclass MyFirstGrid extends React.Component {\n  render() {\n    // layout is an array of objects, see the demo for more complete usage\n    const layout = [\n      { i: \"a\", x: 0, y: 0, w: 1, h: 2, static: true },\n      { i: \"b\", x: 1, y: 0, w: 3, h: 2, minW: 2, maxW: 4 },\n      { i: \"c\", x: 4, y: 0, w: 1, h: 2 }\n    ];\n    return (\n      <GridLayout\n        className=\"layout\"\n        layout={layout}\n        cols={12}\n        rowHeight={30}\n        width={1200}\n      >\n        <div key=\"a\">a</div>\n        <div key=\"b\">b</div>\n        <div key=\"c\">c</div>\n      </GridLayout>\n    );\n  }\n}\n```\n\nYou may also choose to set layout properties directly on the children:\n\n```js\nimport GridLayout from \"react-grid-layout\";\n\nclass MyFirstGrid extends React.Component {\n  render() {\n    return (\n      <GridLayout className=\"layout\" cols={12} rowHeight={30} width={1200}>\n        <div key=\"a\" data-grid={{ x: 0, y: 0, w: 1, h: 2, static: true }}>\n          a\n        </div>\n        <div key=\"b\" data-grid={{ x: 1, y: 0, w: 3, h: 2, minW: 2, maxW: 4 }}>\n          b\n        </div>\n        <div key=\"c\" data-grid={{ x: 4, y: 0, w: 1, h: 2 }}>\n          c\n        </div>\n      </GridLayout>\n    );\n  }\n}\n```\n\n### Usage without Browserify/Webpack\n\nA module usable in a `<script>` tag is included [here](/dist/react-grid-layout.min.js). It uses a UMD shim and\nexcludes `React`, so it must be otherwise available in your application, either via RequireJS or on `window.React`.\n\n## Drag and Drop Usage\n\n### Cross-Grid Drag and Drop\n\nTo enable dragging items between multiple grid instances, wrap your grids with `<DragDropProvider>`:\n\n```js\nimport GridLayout, { DragDropProvider } from \"react-grid-layout\";\n\nclass MyCrossGridExample extends React.Component {\n  state = {\n    layout1: [{ i: \"a\", x: 0, y: 0, w: 2, h: 2 }],\n    layout2: [{ i: \"b\", x: 0, y: 0, w: 2, h: 2 }]\n  };\n\n  onLayoutChange1 = (layout) => this.setState({ layout1: layout });\n  onLayoutChange2 = (layout) => this.setState({ layout2: layout });\n\n  render() {\n    return (\n      <DragDropProvider>\n        <GridLayout\n          id=\"grid-1\"\n          enableCrossGridDrag={true}\n          layout={this.state.layout1}\n          onLayoutChange={this.onLayoutChange1}\n          cols={12}\n          rowHeight={30}\n          width={600}\n        >\n          {this.state.layout1.map(item => (\n            <div key={item.i}>{item.i}</div>\n          ))}\n        </GridLayout>\n\n        <GridLayout\n          id=\"grid-2\"\n          enableCrossGridDrag={true}\n          layout={this.state.layout2}\n          onLayoutChange={this.onLayoutChange2}\n          cols={12}\n          rowHeight={30}\n          width={600}\n        >\n          {this.state.layout2.map(item => (\n            <div key={item.i}>{item.i}</div>\n          ))}\n        </GridLayout>\n      </DragDropProvider>\n    );\n  }\n}\n```\n\n**Advanced: Conditional Drop Acceptance**\n\nUse a predicate function to control which items can be dropped on a grid:\n\n```js\n// Only accept items from a specific grid\n<GridLayout\n  id=\"grid-2\"\n  enableCrossGridDrag={true}\n  crossGridAcceptsDrop={(item, sourceId) => sourceId === \"grid-1\"}\n  // ... other props\n/>\n\n// Only accept specific item types\n<GridLayout\n  id=\"grid-2\"\n  enableCrossGridDrag={true}\n  crossGridAcceptsDrop={(item, sourceId) => item.type === \"widget\"}\n  // ... other props\n/>\n```\n\n### External Droppable Containers\n\nUse the `<Droppable>` component to create custom drop zones outside of grids:\n\n```js\nimport GridLayout, { DragDropProvider, Droppable } from \"react-grid-layout\";\n\nclass ExternalDropExample extends React.Component {\n  state = {\n    layout: [\n      { i: \"a\", x: 0, y: 0, w: 2, h: 2 },\n      { i: \"b\", x: 2, y: 0, w: 2, h: 2 }\n    ],\n    deletedItems: []\n  };\n\n  handleDrop = (item) => {\n    // Item was dropped on the trash zone\n    this.setState(prev => ({\n      deletedItems: [...prev.deletedItems, item.i]\n    }));\n  };\n\n  onLayoutChange = (layout) => {\n    this.setState({ layout });\n  };\n\n  render() {\n    return (\n      <DragDropProvider>\n        <GridLayout\n          id=\"grid-1\"\n          enableCrossGridDrag={true}\n          layout={this.state.layout}\n          onLayoutChange={this.onLayoutChange}\n          cols={12}\n          rowHeight={30}\n          width={600}\n        >\n          {this.state.layout.map(item => (\n            <div key={item.i}>{item.i}</div>\n          ))}\n        </GridLayout>\n\n        <Droppable\n          id=\"trash\"\n          onDrop={this.handleDrop}\n          className=\"trash-zone\"\n          activeClassName=\"drop-active\"\n        >\n          {({ isActive, draggedItem }) => (\n            <div>\n              {isActive\n                ? `Drop ${draggedItem?.i} to delete`\n                : \"🗑️ Drag items here to delete\"\n              }\n            </div>\n          )}\n        </Droppable>\n      </DragDropProvider>\n    );\n  }\n}\n```\n\n**Droppable Features:**\n\n- **Automatic CSS classes:** `.drop-active` when mouse is over, `.drop-source` for source grids\n- **Render props:** Access to `isActive`, `isSource`, `draggedItem`, `mouseX`, `mouseY`\n- **Event callbacks:** `onDragEnter`, `onDragOver`, `onDragLeave`, `onDrop`\n- **Conditional acceptance:** Use boolean or predicate function\n- **Live positioning:** Mouse coordinates for custom placeholders\n\n**Advanced: Custom Placeholder**\n\n```js\n<Droppable id=\"canvas\" onDragOver={(item, mouseX, mouseY) => {\n  // Update placeholder position in real-time\n  this.setState({ placeholderX: mouseX, placeholderY: mouseY });\n}}>\n  {({ isActive, mouseX, mouseY, draggedItem }) => (\n    <div className=\"canvas\">\n      {isActive && (\n        <div\n          className=\"placeholder\"\n          style={{ left: mouseX - 25, top: mouseY - 25 }}\n        >\n          {draggedItem?.i}\n        </div>\n      )}\n    </div>\n  )}\n</Droppable>\n```\n\n### Cross-Layout Drag and Drop (Grid ↔ Flex)\n\nItems can be dragged between grid layouts and flex layouts seamlessly. The library automatically transforms items between coordinate systems:\n\n```js\nimport GridLayout, { DragDropProvider, ReactFlexLayout } from \"react-grid-layout\";\n\nclass CrossLayoutExample extends React.Component {\n  state = {\n    gridLayout: [\n      { i: \"a\", x: 0, y: 0, w: 2, h: 2 },\n      { i: \"b\", x: 2, y: 0, w: 2, h: 4 }\n    ],\n    flexLayout: [\n      { i: \"c\", order: 0, grow: 0, shrink: 1 },\n      { i: \"d\", order: 1, grow: 1, shrink: 1 }\n    ]\n  };\n\n  onGridChange = (layout) => this.setState({ gridLayout: layout });\n  onFlexChange = (layout) => this.setState({ flexLayout: layout });\n\n  render() {\n    return (\n      <DragDropProvider>\n        {/* Grid Layout */}\n        <GridLayout\n          id=\"grid-1\"\n          enableCrossGridDrag={true}\n          layout={this.state.gridLayout}\n          onLayoutChange={this.onGridChange}\n          cols={12}\n          rowHeight={30}\n          width={600}\n        >\n          {this.state.gridLayout.map(item => (\n            <div key={item.i}>{item.i}</div>\n          ))}\n        </GridLayout>\n\n        {/* Flex Layout */}\n        <ReactFlexLayout\n          id=\"flex-1\"\n          enableCrossGridDrag={true}\n          isDraggable={true}\n          direction=\"row\"\n          gap={10}\n          style={{ width: \"600px\" }}\n          layout={this.state.flexLayout}\n          onLayoutChange={this.onFlexChange}\n        >\n          {this.state.flexLayout.map(item => (\n            <div key={item.i}>{item.i}</div>\n          ))}\n        </ReactFlexLayout>\n      </DragDropProvider>\n    );\n  }\n}\n```\n\n**How Item Transformation Works:**\n\nWhen dragging items between grids and flex layouts, the library automatically converts properties:\n\n- **Grid → Flex**: `{x, y, w, h}` coordinates are converted to physical pixel dimensions (`width`, `height`)\n- **Flex → Grid**: Pixel dimensions are converted to grid units based on `cols` and `rowHeight`\n- **Constraints**: `minW/maxW/minH/maxH` ↔ `minWidth/maxWidth/minHeight/maxHeight` are automatically converted\n\n**Visual Feedback During Cross-Container Drag:**\n\nCross-container drags use a hybrid indicator approach for a smooth, stable experience:\n\n- **Source container**: The dragged item stays at its original position (hidden) - no layout shifts while dragging out\n- **Target container**: Shows a lightweight insertion indicator instead of a full placeholder:\n  - **Grid targets**: Dashed outline showing where the item will be placed\n  - **Flex targets**: Line indicator at the insertion point\n- **Faded items**: Existing items in the target container fade to 40% opacity, making the insertion indicator clearly visible\n- **On drop**: Layout shifts once when the item is actually placed, with smooth animation\n\nThis approach follows industry standards (similar to Trello, Notion, Figma) and eliminates the jarring layout shifts that occur with traditional full-placeholder approaches during nested container drags.\n\n**Customizing Insertion Indicators:**\n\nYou can customize the appearance of insertion indicators via CSS:\n\n```css\n/* Grid insertion indicator (dashed outline) */\n.react-grid-insertion-indicator {\n  border: 2px dashed #2196F3;\n  background: rgba(33, 150, 243, 0.1);\n  border-radius: 4px;\n}\n\n/* Flex insertion indicator (line) */\n.react-flex-insertion-indicator {\n  background: #2196F3;\n}\n\n/* Fade amount for existing items in drop target */\n.react-grid-layout.drop-active > .react-grid-item:not(.react-draggable-dragging),\n.react-flex-layout.drop-active > .react-flex-item:not(.react-draggable-dragging) {\n  opacity: 0.4;\n}\n```\n\n**Conditional Drop Acceptance:**\n\nBoth grids and flex layouts support conditional drop acceptance:\n\n```js\n// Only accept items from specific sources\n<ReactFlexLayout\n  id=\"flex-1\"\n  enableCrossGridDrag={true}\n  crossGridAcceptsDrop={(item, sourceId) => sourceId === \"grid-1\"}\n  // ... other props\n/>\n\n// Only accept specific item types\n<GridLayout\n  id=\"grid-2\"\n  enableCrossGridDrag={true}\n  crossGridAcceptsDrop={(item, sourceId) => item.type === \"widget\"}\n  // ... other props\n/>\n```\n\n**Rendering Custom Dropping Items:**\n\nFor flex layouts, you can customize how items from other containers appear while being dragged:\n\n```js\n<ReactFlexLayout\n  id=\"flex-1\"\n  enableCrossGridDrag={true}\n  renderDroppingItem={(item) => (\n    <div style={{ background: \"#e0e0e0\", padding: \"20px\" }}>\n      Dropping: {item.i}\n    </div>\n  )}\n  // ... other props\n>\n  {/* children */}\n</ReactFlexLayout>\n```\n\n## Responsive Usage\n\nTo make RGL responsive, use the `<ResponsiveReactGridLayout>` element:\n\n```js\nimport { Responsive as ResponsiveGridLayout } from \"react-grid-layout\";\n\nclass MyResponsiveGrid extends React.Component {\n  render() {\n    // {lg: layout1, md: layout2, ...}\n    const layouts = getLayoutsFromSomewhere();\n    return (\n      <ResponsiveGridLayout\n        className=\"layout\"\n        layouts={layouts}\n        breakpoints={{ lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 }}\n        cols={{ lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 }}\n      >\n        <div key=\"1\">1</div>\n        <div key=\"2\">2</div>\n        <div key=\"3\">3</div>\n      </ResponsiveGridLayout>\n    );\n  }\n}\n```\n\nWhen in responsive mode, you should supply at least one breakpoint via the `layouts` property.\n\nWhen using `layouts`, it is best to supply as many breakpoints as possible, especially the largest one.\nIf the largest is provided, RGL will attempt to interpolate the rest.\n\nYou will also need to provide a `width`, when using `<ResponsiveReactGridLayout>` it is suggested you use the HOC\n`WidthProvider` as per the instructions below.\n\nIt is possible to supply default mappings via the `data-grid` property on individual\nitems, so that they would be taken into account within layout interpolation.\n\n## Flex Layout Usage\n\n`ReactFlexLayout` is an alternative layout component that uses CSS Flexbox instead of a grid system. It's ideal for layouts where items should flow naturally and adapt to content, while still supporting drag-and-drop reordering.\n\n### Basic Flex Layout\n\n```js\nimport { ReactFlexLayout } from \"react-grid-layout\";\n\nclass MyFlexLayout extends React.Component {\n  render() {\n    // layout is an array of objects with flex properties\n    const layout = [\n      { i: \"a\", order: 0, grow: 0, shrink: 1 },\n      { i: \"b\", order: 1, grow: 1, shrink: 1 },\n      { i: \"c\", order: 2, grow: 0, shrink: 1 }\n    ];\n\n    return (\n      <ReactFlexLayout\n        layout={layout}\n        direction=\"row\"\n        justifyContent=\"flex-start\"\n        alignItems=\"stretch\"\n        gap={10}\n        style={{ width: \"1200px\" }}\n      >\n        <div key=\"a\">Item A</div>\n        <div key=\"b\">Item B (grows)</div>\n        <div key=\"c\">Item C</div>\n      </ReactFlexLayout>\n    );\n  }\n}\n```\n\n### Using WidthProvider with Flex Layout\n\nLike `ReactGridLayout`, `ReactFlexLayout` also works with `WidthProvider`:\n\n```js\nimport { ReactFlexLayout, WidthProvider } from \"react-grid-layout\";\n\nconst FlexLayout = WidthProvider(ReactFlexLayout);\n\nclass MyResponsiveFlexLayout extends React.Component {\n  render() {\n    const layout = [\n      { i: \"a\", order: 0, grow: 0, shrink: 1 },\n      { i: \"b\", order: 1, grow: 1, shrink: 1 },\n      { i: \"c\", order: 2, grow: 0, shrink: 1 }\n    ];\n\n    return (\n      <FlexLayout\n        layout={layout}\n        direction=\"row\"\n        justifyContent=\"space-between\"\n        alignItems=\"center\"\n        gap={15}\n      >\n        <div key=\"a\">a</div>\n        <div key=\"b\">b</div>\n        <div key=\"c\">c</div>\n      </FlexLayout>\n    );\n  }\n}\n```\n\n### Flex Item Properties via data-flex\n\nYou can also define flex properties directly on children:\n\n```js\n<ReactFlexLayout\n  direction=\"row\"\n  gap={10}\n  style={{ width: \"1200px\" }}\n>\n  <div key=\"a\" data-flex={{ order: 0, grow: 0, shrink: 1 }}>\n    a\n  </div>\n  <div key=\"b\" data-flex={{ order: 1, grow: 1, shrink: 1 }}>\n    b\n  </div>\n  <div key=\"c\" data-flex={{ order: 2, grow: 0, shrink: 1 }}>\n    c\n  </div>\n</ReactFlexLayout>\n```\n\n### Key Differences from Grid Layout\n\n- **Layout Properties**: Uses flex properties (`order`, `grow`, `shrink`) instead of grid coordinates (`x`, `y`, `w`, `h`)\n- **Sizing**: Items are sized using `grow` and `shrink` with optional size constraints (`minWidth`, `maxWidth`, `minHeight`, `maxHeight`)\n- **Container Properties**: Supports flexbox container properties (`direction`, `justifyContent`, `alignItems`, `gap`)\n- **No Resizing**: Flex items are not resizable; size is controlled by flex properties\n- **Reordering**: Drag and drop changes the `order` property rather than position coordinates\n- **Visual Flow**: Items flow naturally according to flexbox rules rather than being absolutely positioned\n\n### Providing Grid Width\n\nBoth `<ResponsiveReactGridLayout>` and `<ReactGridLayout>` take `width` to calculate\npositions on drag events. In simple cases a HOC `WidthProvider` can be used to automatically determine\nwidth upon initialization and window resize events.\n\n```js\nimport { Responsive, WidthProvider } from \"react-grid-layout\";\n\nconst ResponsiveGridLayout = WidthProvider(Responsive);\n\nclass MyResponsiveGrid extends React.Component {\n  render() {\n    // {lg: layout1, md: layout2, ...}\n    var layouts = getLayoutsFromSomewhere();\n    return (\n      <ResponsiveGridLayout\n        className=\"layout\"\n        layouts={layouts}\n        breakpoints={{ lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0 }}\n        cols={{ lg: 12, md: 10, sm: 6, xs: 4, xxs: 2 }}\n      >\n        <div key=\"1\">1</div>\n        <div key=\"2\">2</div>\n        <div key=\"3\">3</div>\n      </ResponsiveGridLayout>\n    );\n  }\n}\n```\n\nThis allows you to easily replace `WidthProvider` with your own Provider HOC if you need more sophisticated logic.\n\n`WidthProvider` accepts a single prop, `measureBeforeMount`. If `true`, `WidthProvider` will measure the\ncontainer's width before mounting children. Use this if you'd like to completely eliminate any resizing animation\non application/component mount.\n\nHave a more complicated layout? `WidthProvider` [is very simple](/lib/components/WidthProvider.jsx) and only\nlistens to window `'resize'` events. If you need more power and flexibility, try the\n[SizeMe React HOC](https://github.com/ctrlplusb/react-sizeme) as an alternative to WidthProvider.\n\n### Grid Layout Props\n\nRGL supports the following properties (see the source for the final word on this):\n\n```js\n//\n// Basic props\n//\n\n// This allows setting the initial width on the server side.\n// This is required unless using the HOC <WidthProvider> or similar\nwidth: number,\n\n// If true, the container height swells and contracts to fit contents\nautoSize: ?boolean = true,\n\n// Number of columns in this layout.\ncols: ?number = 12,\n\n// A CSS selector for tags that will not be draggable.\n// For example: draggableCancel:'.MyNonDraggableAreaClassName'\n// If you forget the leading . it will not work.\n// .react-resizable-handle\" is always prepended to this value.\ndraggableCancel: ?string = '',\n\n// A CSS selector for tags that will act as the draggable handle.\n// For example: draggableHandle:'.MyDragHandleClassName'\n// If you forget the leading . it will not work.\ndraggableHandle: ?string = '',\n\n// Compaction type.\ncompactType: ?('vertical' | 'horizontal' | null) = 'vertical';\n\n// Layout is an array of objects with the format:\n// The index into the layout must match the key used on each item component.\n// If you choose to use custom keys, you can specify that key in the layout\n// array objects using the `i` prop.\nlayout: ?Array<{i?: string, x: number, y: number, w: number, h: number}> = null, // If not provided, use data-grid props on children\n\n// Margin between items [x, y] in px.\nmargin: ?[number, number] = [10, 10],\n\n// Padding inside the container [x, y] in px\ncontainerPadding: ?[number, number] = margin,\n\n// Rows have a static height, but you can change this based on breakpoints\n// if you like.\nrowHeight: ?number = 150,\n\n// Configuration of a dropping element. Dropping element is a \"virtual\" element\n// which appears when you drag over some element from outside.\n// It can be changed by passing specific parameters:\n//  i - id of an element\n//  w - width of an element\n//  h - height of an element\ndroppingItem?: { i: string, w: number, h: number }\n\n//\n// Flags\n//\nisDraggable: ?boolean = true,\nisResizable: ?boolean = true,\nisBounded: ?boolean = false,\n// Uses CSS3 translate() instead of position top/left.\n// This makes about 6x faster paint performance\nuseCSSTransforms: ?boolean = true,\n// If parent DOM node of ResponsiveReactGridLayout or ReactGridLayout has \"transform: scale(n)\" css property,\n// we should set scale coefficient to avoid render artefacts while dragging.\ntransformScale: ?number = 1,\n\n// If true, grid can be placed one over the other.\n// If set, implies `preventCollision`.\nallowOverlap: ?boolean = false,\n\n// If true, grid items won't change position when being\n// dragged over. If `allowOverlap` is still false,\n// this simply won't allow one to drop on an existing object.\npreventCollision: ?boolean = false,\n\n// If true, droppable elements (with `draggable={true}` attribute)\n// can be dropped on the grid. It triggers \"onDrop\" callback\n// with position and event object as parameters.\n// It can be useful for dropping an element in a specific position\n//\n// NOTE: In case of using Firefox you should add\n// `onDragStart={e => e.dataTransfer.setData('text/plain', '')}` attribute\n// along with `draggable={true}` otherwise this feature will work incorrect.\n// onDragStart attribute is required for Firefox for a dragging initialization\n// @see https://bugzilla.mozilla.org/show_bug.cgi?id=568313\nisDroppable: ?boolean = false,\n\n//\n// Cross-Grid Drag and Drop\n//\n\n// Unique identifier for this grid instance. Required when using cross-grid drag and drop.\nid: ?string,\n\n// If true, enables cross-grid drag and drop functionality.\n// Items can be dragged between multiple grid instances wrapped in a <DragDropProvider>.\nenableCrossGridDrag: ?boolean = false,\n\n// Controls whether this grid accepts items dropped from other grids.\n// Can be a boolean or a predicate function for conditional acceptance.\n// When using a predicate function, it receives the dragged item and source ID:\n//   (item: LayoutItem, sourceId: string) => boolean\n// Examples:\n//   - true/false: Accept/reject all drops\n//   - (item, sourceId) => sourceId === \"grid-1\": Only accept from specific grid\n//   - (item, sourceId) => item.type === \"widget\": Only accept specific item types\ncrossGridAcceptsDrop: ?(boolean | (item: LayoutItem, sourceId: string) => boolean) = true,\n\n// Optional transform function to adapt items when dragging between grids with different configurations.\n// Receives the item and both grid configurations, returns the transformed item.\n// If not provided, items are automatically resized to preserve physical dimensions.\n// Example: (item, sourceConfig, targetConfig) => ({ ...item, w: item.w * 2 })\ncrossGridTransform: ?(item: LayoutItem, sourceConfig: GridConfig, targetConfig: GridConfig) => LayoutItem,\n// Defines which resize handles should be rendered.\n// Allows for any combination of:\n// 's' - South handle (bottom-center)\n// 'w' - West handle (left-center)\n// 'e' - East handle (right-center)\n// 'n' - North handle (top-center)\n// 'sw' - Southwest handle (bottom-left)\n// 'nw' - Northwest handle (top-left)\n// 'se' - Southeast handle (bottom-right)\n// 'ne' - Northeast handle (top-right)\n//\n// Note that changing this property dynamically does not work due to a restriction in react-resizable.\nresizeHandles: ?Array<'s' | 'w' | 'e' | 'n' | 'sw' | 'nw' | 'se' | 'ne'> = ['se'],\n// Custom component for resize handles\n// See `handle` as used in https://github.com/react-grid-layout/react-resizable#resize-handle\n// Your component should have the class `.react-resizable-handle`, or you should add your custom\n// class to the `draggableCancel` prop.\nresizeHandle?: ReactElement<any> | ((resizeHandleAxis: ResizeHandleAxis, ref: ReactRef<HTMLElement>) => ReactElement<any>),\n\n//\n// Callbacks\n//\n\n// Callback so you can save the layout.\n// Calls back with (currentLayout) after every drag or resize stop.\nonLayoutChange: (layout: Layout) => void,\n\n//\n// All callbacks below have signature (layout, oldItem, newItem, placeholder, e, element).\n// 'start' and 'stop' callbacks pass `undefined` for 'placeholder'.\n//\ntype ItemCallback = (layout: Layout, oldItem: LayoutItem, newItem: LayoutItem,\n                     placeholder: LayoutItem, e: MouseEvent, element: HTMLElement) => void,\n\n// Calls when drag starts.\nonDragStart: ItemCallback,\n// Calls on each drag movement.\nonDrag: ItemCallback,\n// Calls when drag is complete.\nonDragStop: ItemCallback,\n// Calls when resize starts.\nonResizeStart: ItemCallback,\n// Calls when resize movement happens.\nonResize: ItemCallback,\n// Calls when resize is complete.\nonResizeStop: ItemCallback,\n\n//\n// Dropover functionality\n//\n\n// Calls when an element has been dropped into the grid from outside.\nonDrop: (layout: Layout, item: ?LayoutItem, e: Event) => void,\n// Calls when an element is being dragged over the grid from outside as above.\n// This callback should return an object to dynamically change the droppingItem size\n// Return false to short-circuit the dragover\nonDropDragOver: (e: DragOverEvent) => ?({|w?: number, h?: number|} | false),\n\n// Ref for getting a reference for the grid's wrapping div.\n// You can use this instead of a regular ref and the deprecated `ReactDOM.findDOMNode()`` function.\n// Note that this type is React.Ref<HTMLDivElement> in TypeScript, Flow has a bug here\n// https://github.com/facebook/flow/issues/8671#issuecomment-862634865\ninnerRef: {current: null | HTMLDivElement},\n```\n\n## Droppable Props\n\nThe `<Droppable>` component creates external drop zones for grid items. It supports the following props:\n\n```js\n//\n// Required props\n//\n\n// Unique identifier for this droppable container\nid: string,\n\n//\n// Drop acceptance\n//\n\n// Controls whether this droppable accepts items\n// Can be a boolean or a predicate function for conditional acceptance\n// When using a predicate function, it receives the dragged item and source ID:\n//   (item: LayoutItem, sourceId: string) => boolean\n// Examples:\n//   - true: Accept all drops (default)\n//   - false: Reject all drops\n//   - (item, sourceId) => sourceId === \"grid-1\": Only accept from specific grid\n//   - (item, sourceId) => item.type === \"widget\": Only accept specific item types\nacceptsDrop: ?(boolean | (item: LayoutItem, sourceId: string) => boolean) = true,\n\n//\n// Event callbacks\n//\n\n// Called when an item is dropped on this droppable\n// Receives the dropped item and mouse coordinates\nonDrop: ?(item: LayoutItem, mouseX: number, mouseY: number) => void,\n\n// Called when drag enters this droppable\nonDragEnter: ?(item: LayoutItem, mouseX: number, mouseY: number) => void,\n\n// Called on every mouse move while over this droppable\n// Useful for updating custom placeholders in real-time\nonDragOver: ?(item: LayoutItem, mouseX: number, mouseY: number) => void,\n\n// Called when drag leaves this droppable\nonDragLeave: ?(item: LayoutItem) => void,\n\n//\n// Styling\n//\n\n// Base CSS class name\nclassName: ?string,\n\n// CSS class applied when mouse is over this droppable\nactiveClassName: ?string = \"drop-active\",\n\n// CSS class applied when this is the drag source\nsourceClassName: ?string = \"drop-source\",\n\n// Inline styles\nstyle: ?Object,\n\n//\n// Children\n//\n\n// Can be React nodes or a render prop function\n// Render prop receives: { isActive, isSource, draggedItem, mouseX, mouseY }\nchildren: ReactNode | ((props: RenderProps) => ReactNode),\n```\n\n**Render Props:**\n\n```js\ntype RenderProps = {\n  // true when mouse is currently over this droppable\n  isActive: boolean,\n\n  // true when this droppable is the drag source\n  isSource: boolean,\n\n  // The item currently being dragged (null when not dragging)\n  draggedItem: ?LayoutItem,\n\n  // Current mouse X coordinate (null when not over this droppable)\n  mouseX: ?number,\n\n  // Current mouse Y coordinate (null when not over this droppable)\n  mouseY: ?number\n};\n```\n\n### Responsive Grid Layout Props\n\nThe responsive grid layout can be used instead. It supports all of the props above, excepting `layout`.\nThe new properties and changes are:\n\n```js\n// {name: pxVal}, e.g. {lg: 1200, md: 996, sm: 768, xs: 480}\n// Breakpoint names are arbitrary but must match in the cols and layouts objects.\nbreakpoints: ?Object = {lg: 1200, md: 996, sm: 768, xs: 480, xxs: 0},\n\n// # of cols. This is a breakpoint -> cols map, e.g. {lg: 12, md: 10, ...}\ncols: ?Object = {lg: 12, md: 10, sm: 6, xs: 4, xxs: 2},\n\n\n// margin (in pixels). Can be specified either as horizontal and vertical margin, e.g. `[10, 10]` or as a breakpoint -> margin map, e.g. `{lg: [10, 10], md: [10, 10], ...}.\nmargin: [number, number] | {[breakpoint: $Keys<breakpoints>]: [number, number]},\n\n\n// containerPadding (in pixels). Can be specified either as horizontal and vertical padding, e.g. `[10, 10]` or as a breakpoint -> containerPadding map, e.g. `{lg: [10, 10], md: [10, 10], ...}.\ncontainerPadding: [number, number] | {[breakpoint: $Keys<breakpoints>]: [number, number]},\n\n\n// layouts is an object mapping breakpoints to layouts.\n// e.g. {lg: Layout, md: Layout, ...}\nlayouts: {[key: $Keys<breakpoints>]: Layout},\n\n//\n// Callbacks\n//\n\n// Calls back with breakpoint and new # cols\nonBreakpointChange: (newBreakpoint: string, newCols: number) => void,\n\n// Callback so you can save the layout.\n// AllLayouts are keyed by breakpoint.\nonLayoutChange: (currentLayout: Layout, allLayouts: {[key: $Keys<breakpoints>]: Layout}) => void,\n\n// Callback when the width changes, so you can modify the layout as needed.\nonWidthChange: (containerWidth: number, margin: [number, number], cols: number, containerPadding: [number, number]) => void;\n\n```\n\n### Grid Item Props\n\nRGL supports the following properties on grid items or layout items. When initializing a grid,\nbuild a layout array (as in the first example above), or attach this object as the `data-grid` property\nto each of your child elements (as in the second example).\n\nIf `data-grid` is provided on an item, it will take precedence over an item in the `layout` with the same key (`i`).\n\nNote that if a grid item is provided but incomplete (missing one of `x, y, w, or h`), an error\nwill be thrown so you can correct your layout.\n\nIf no properties are provided for a grid item, one will be generated with a width and height of `1`.\n\nYou can set minimums and maximums for each dimension. This is for resizing; it of course has no effect if resizing\nis disabled. Errors will be thrown if your mins and maxes overlap incorrectly, or your initial dimensions\nare out of range.\n\nAny `<GridItem>` properties defined directly will take precedence over globally-set options. For\nexample, if the layout has the property `isDraggable: false`, but the grid item has the prop `isDraggable: true`, the item\nwill be draggable, even if the item is marked `static: true`.\n\n```js\n{\n\n  // A string corresponding to the component key\n  i: string,\n\n  // These are all in grid units, not pixels\n  x: number,\n  y: number,\n  w: number,\n  h: number,\n  minW: ?number = 0,\n  maxW: ?number = Infinity,\n  minH: ?number = 0,\n  maxH: ?number = Infinity,\n\n  // If true, equal to `isDraggable: false, isResizable: false`.\n  static: ?boolean = false,\n  // If false, will not be draggable. Overrides `static`.\n  isDraggable: ?boolean = true,\n  // If false, will not be resizable. Overrides `static`.\n  isResizable: ?boolean = true,\n  // By default, a handle is only shown on the bottom-right (southeast) corner.\n  // As of RGL >= 1.4.0, resizing on any corner works just fine!\n  resizeHandles?: ?Array<'s' | 'w' | 'e' | 'n' | 'sw' | 'nw' | 'se' | 'ne'> = ['se']\n  // If true and draggable, item will be moved only within grid.\n  isBounded: ?boolean = false\n}\n```\n\n### Grid Item Heights and Widths\n\nGrid item widths are based on container and number of columns. The size of a grid unit's height is based on `rowHeight`.\n\nNote that an item that has `h=2` is _not exactly twice as tall as one with `h=1` unless you have no `margin`_!\n\nIn order for the grid to not be ragged, when an item spans grid units, it must also span margins. So you must add the height or width or the margin you are spanning for each unit. So actual pixel height is `(rowHeight * h) + (marginH * (h - 1)`.\n\nFor example, with `rowHeight=30`, `margin=[10,10]` and a unit with height 4, the calculation is `(30 * 4) + (10 * 3)`\n\n![margin](margin.png)\n\nIf this is a problem for you, set `margin=[0,0]` and handle visual spacing between your elements inside the elements' content.\n\n## Flex Layout Props\n\n`ReactFlexLayout` supports the following properties:\n\n```js\n//\n// Basic props\n//\n\n// CSS class name\nclassName: ?string = \"\",\n\n// Inline styles (can include width for sizing)\nstyle: ?Object = {},\n\n//\n// Flexbox container props\n//\n\n// Flex direction: \"row\", \"column\", \"row-reverse\", \"column-reverse\"\ndirection: ?FlexDirection = \"row\",\n\n// Flex justify-content: \"flex-start\", \"flex-end\", \"center\", \"space-between\", \"space-around\", \"space-evenly\"\njustifyContent: ?FlexJustifyContent = \"flex-start\",\n\n// Flex align-items: \"flex-start\", \"flex-end\", \"center\", \"stretch\", \"baseline\"\nalignItems: ?FlexAlignItems = \"stretch\",\n\n// Gap between items in pixels\ngap: ?number = 0,\n\n//\n// Draggability\n//\n\n// A CSS selector for tags that will not be draggable\ndraggableCancel: ?string = \"\",\n\n// A CSS selector for tags that will act as the draggable handle\ndraggableHandle: ?string = \"\",\n\n// Layout is an array of objects with the format:\n// {i: string, order: number, grow: number, shrink: number}\n// The i property must match the key used on each item component.\n// Item sizing is controlled by grow/shrink and optional size constraints (minWidth, maxWidth, etc)\nlayout: ?FlexLayout = [],\n\n//\n// Flags\n//\n\n// If true, items can be dragged\nisDraggable: ?boolean = true,\n\n// If true, items will be kept within container bounds during drag\nisBounded: ?boolean = false,\n\n// If true, droppable elements can be dropped on the layout\nisDroppable: ?boolean = false,\n\n// Uses CSS3 translate() instead of position top/left for better performance\nuseCSSTransforms: ?boolean = true,\n\n// Scale coefficient if parent has \"transform: scale(n)\" CSS property\ntransformScale: ?number = 1,\n\n//\n// Cross-Grid Drag and Drop (same as GridLayout)\n//\n\n// Unique identifier for this flex layout instance. Required when using cross-grid drag.\nid: ?string,\n\n// If true, enables cross-grid drag and drop functionality.\n// Items can be dragged between grids, flex layouts, and external droppable containers.\nenableCrossGridDrag: ?boolean = false,\n\n// Controls whether this flex layout accepts items dropped from other layouts\n// Can be a boolean or a predicate function:\n//   (item: LayoutItem, sourceId: string) => boolean\n// Examples:\n//   - true/false: Accept/reject all drops\n//   - (item, sourceId) => sourceId === \"grid-1\": Only accept from specific container\n//   - (item, sourceId) => item.type === \"widget\": Only accept specific item types\ncrossGridAcceptsDrop: ?(boolean | (item: LayoutItem, sourceId: string) => boolean) = true,\n\n// Custom render function for items being dragged from other containers\n// Allows you to customize the appearance of external items during drag\n// The function receives the item being dragged and should return a React element\nrenderDroppingItem: ?(item: LayoutItem) => ReactElement,\n\n//\n// Callbacks\n//\n\n// Called after every drag or reorder with the new layout\nonLayoutChange: (layout: FlexLayout) => void,\n\n// Callback signature: (layout, oldItem, newItem, placeholder, e, element)\ntype FlexItemCallback = (\n  layout: FlexLayout,\n  oldItem: ?FlexLayoutItem,\n  newItem: ?FlexLayoutItem,\n  placeholder: ?FlexLayoutItem,\n  e: Event,\n  element: HTMLElement\n) => void,\n\n// Called when drag starts\nonDragStart: FlexItemCallback,\n\n// Called on each drag movement\nonDrag: FlexItemCallback,\n\n// Called when drag is complete\nonDragStop: FlexItemCallback,\n\n// Called when an element is dropped into the flex layout from outside\nonDrop: (layout: FlexLayout, item: ?FlexLayoutItem, e: Event) => void,\n\n// Ref for getting a reference to the flex container's wrapping div\ninnerRef: {current: null | HTMLDivElement},\n```\n\n## Flex Item Props\n\nFlex layout items support the following properties. When initializing a flex layout,\nbuild a layout array, or attach this object as the `data-flex` property to each child element.\n\n```js\n{\n  // A string corresponding to the component key (required)\n  i: string,\n\n  // Flex order property (determines visual order)\n  order: number,\n\n  // Flex-grow (how much the item should grow relative to others)\n  grow: number,\n\n  // Flex-shrink (how much the item should shrink relative to others)\n  shrink: number,\n\n  // Override container's alignItems for this specific item\n  // \"auto\", \"flex-start\", \"flex-end\", \"center\", \"stretch\", \"baseline\"\n  alignSelf: ?FlexAlignSelf,\n\n  // Size constraints (in pixels)\n  // These are automatically converted when dragging between grids and flex layouts\n  minWidth: ?number,\n  maxWidth: ?number,\n  minHeight: ?number,\n  maxHeight: ?number,\n\n  // If true, item cannot be dragged (equal to isDraggable: false)\n  static: ?boolean = false,\n\n  // If false, item will not be draggable. Overrides `static`.\n  isDraggable: ?boolean = true,\n}\n```\n\n**Example Flex Layout Array:**\n\n```js\nconst layout = [\n  // Fixed width item with size constraints\n  { i: \"sidebar\", order: 0, grow: 0, shrink: 0, minWidth: 250, maxWidth: 250 },\n\n  // Flexible content area (grows to fill space)\n  { i: \"content\", order: 1, grow: 1, shrink: 1 },\n\n  // Item with min/max constraints (automatically applied during cross-layout drag)\n  {\n    i: \"panel\",\n    order: 2,\n    grow: 0,\n    shrink: 1,\n    minWidth: 200,\n    maxWidth: 400\n  },\n\n  // Static (non-draggable) item with fixed size\n  { i: \"footer\", order: 3, grow: 0, shrink: 0, minHeight: 100, maxHeight: 100, static: true }\n];\n```\n\n### Performance\n\n`<ReactGridLayout>` has [an optimized `shouldComponentUpdate` implementation](lib/ReactGridLayout.jsx), but it relies on the user memoizing the `children` array:\n\n```js\n// lib/ReactGridLayout.jsx\n// ...\nshouldComponentUpdate(nextProps: Props, nextState: State) {\n  return (\n    // NOTE: this is almost always unequal. Therefore the only way to get better performance\n    // from SCU is if the user intentionally memoizes children. If they do, and they can\n    // handle changes properly, performance will increase.\n    this.props.children !== nextProps.children ||\n    !fastRGLPropsEqual(this.props, nextProps, isEqual) ||\n    !isEqual(this.state.activeDrag, nextState.activeDrag)\n  );\n}\n// ...\n```\n\nIf you memoize your children, you can take advantage of this, and reap faster rerenders. For example:\n\n```js\nfunction MyGrid(props) {\n  const children = React.useMemo(() => {\n    return new Array(props.count).fill(undefined).map((val, idx) => {\n      return <div key={idx} data-grid={{ x: idx, y: 1, w: 1, h: 1 }} />;\n    });\n  }, [props.count]);\n  return <ReactGridLayout cols={12}>{children}</ReactGridLayout>;\n}\n```\n\nBecause the `children` prop doesn't change between rerenders, updates to `<MyGrid>` won't result in new renders, improving performance.\n\n### React Hooks Performance\n\nUsing hooks to save your layout state on change will cause the layouts to re-render as the ResponsiveGridLayout will change it's value on every render.\nTo avoid this you should wrap your WidthProvider in a useMemo:\n\n```js\nconst ResponsiveReactGridLayout = useMemo(() => WidthProvider(Responsive), []);\n```\n\n### Custom Child Components and Draggable Handles\n\nIf you use React Components as grid children, they need to do a few things:\n\n1. Forward refs to an underlying DOM node, and\n2. Forward `style`,`className`, `onMouseDown`, `onMouseUp` and `onTouchEnd` to that same DOM node.\n\nFor example:\n\n```js\nconst CustomGridItemComponent = React.forwardRef(({style, className, onMouseDown, onMouseUp, onTouchEnd, children, ...props}, ref) => {\n  return (\n    <div style={{ /* styles */, ...style}} className={className} ref={ref} onMouseDown={onMouseDown} onMouseUp={onMouseUp} onTouchEnd={onTouchEnd}>\n      {/* Some other content */}\n      {children} {/* Make sure to include children to add resizable handle */}\n    </div>\n  );\n})\n```\n\nThe same is true of custom elements as draggable handles using the `draggableHandle` prop. This is so that\nthe underlying `react-draggable` library can get a reference to the DOM node underneath, manipulate\npositioning via `style`, and set classes.\n\n## Contribute\n\nIf you have a feature request, please add it as an issue or make a pull request.\n\nIf you have a bug to report, please reproduce the bug in [CodeSandbox](https://codesandbox.io/s/staging-bush-3lvt7?file=/src/ShowcaseLayout.js) to help\nus easily isolate it.\n\n## TODO List\n\n- [x] Basic grid layout\n- [x] Fluid grid layout\n- [x] Grid packing\n- [x] Draggable grid items\n- [x] Live grid packing while dragging\n- [x] Resizable grid items\n- [x] Layouts per responsive breakpoint\n- [x] Define grid attributes on children themselves (`data-grid` key)\n- [x] Static elements\n- [x] Persistent id per item for predictable localstorage restores, even when # items changes\n- [x] Min/max w/h per item\n- [x] Resizable handles on other corners\n- [ ] Configurable w/h per breakpoint\n","readmeFilename":"README.md"}