{"_id":"react-editable-photo-grid","_rev":"222-67f8dbb187896b790cabf92ddaf39197","name":"react-editable-photo-grid","dist-tags":{"latest":"3.1.1"},"versions":{"1.0.0":{"name":"react-editable-photo-grid","version":"1.0.0","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@1.0.0","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-photo-grid/issues"},"dist":{"shasum":"c941ccf8f79ccf8eb7adeac26b30135a49c2853b","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-1.0.0.tgz","fileCount":14,"integrity":"sha512-OM0lPrGz6r2cTPEO1HZkebyMpgvvEHwjcfsf5n4ubi2Bl7PRybAWhJalC+Vk+0ogu7Nh/7xoER9g/RqaBtzBpw==","signatures":[{"sig":"MEUCIBGY9ci+Xl9qgxYDwrH3lIxV0CtIxCnq2HSQtE8Zqe9yAiEA6VkXHpA9ZqvhvzsCXAPPsUaFxJaN1X6ht9J+IMxYcQ8=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":67201},"main":"index.js","gitHead":"f3dc071ffa28571bb9a59bdee0eb30910b431620","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-photo-grid.git","type":"git"},"_npmVersion":"10.2.1","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.9.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","typescript":"^5.5.3","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_1.0.0_1721136995904_0.8650201827220534","host":"s3://npm-registry-packages"}},"2.3.0":{"name":"react-editable-photo-grid","version":"2.3.0","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@2.3.0","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"4d5accc5bce1d715f2c873328b361bcf07dbdbc7","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-2.3.0.tgz","fileCount":14,"integrity":"sha512-R1M7afFj/B6NxN/L+HcW/WvJRNolEJlG9ZBAFLKydTCAGTYUubnGwtXf0/yVRg+t1b//9DIKYiDf6h2nr0K36A==","signatures":[{"sig":"MEYCIQCjJhVD2GJPiEjxK/6YDsTbXeR/VEIJHyN2tHkcc89u/AIhAKXozALLoLVciASAsMaIQw1NwvDseqUK7RijB7jp5y5w","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":113961},"main":"dist/index.js","gitHead":"48d572a6a25c6f1c0b5400c2635adc00109037bf","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.2.1","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.9.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_2.3.0_1722791133881_0.6924407960799919","host":"s3://npm-registry-packages"}},"2.3.3":{"name":"react-editable-photo-grid","version":"2.3.3","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@2.3.3","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"119697872bb17e3731807dc20d0dd18a5716dd44","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-2.3.3.tgz","fileCount":14,"integrity":"sha512-yiZuksTZX/5VDh4+xranB0GGEPR7vviwkb4ISB+pQTjMXD3KhbZVyHnEBZsC+zzB8qsuUIWREI9z3XupFQV11w==","signatures":[{"sig":"MEYCIQDEUMVxRC931M5JQa9GM79AhXNLlMP4iP9CAixgD/Km6AIhAMcngArzDiRy7qmmqheuNaupP7D109JFPbJjIsUJMvcr","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":114380},"main":"dist/index.js","gitHead":"48d572a6a25c6f1c0b5400c2635adc00109037bf","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.2.1","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.9.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_2.3.3_1722797576121_0.027875397006856817","host":"s3://npm-registry-packages"}},"2.3.4":{"name":"react-editable-photo-grid","version":"2.3.4","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@2.3.4","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"5989dc8976baa0a8399818a5d937a1316669f457","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-2.3.4.tgz","fileCount":14,"integrity":"sha512-0PsJSpl+w0LxrbbnK7L4MhWsuBfqTjZdnLnV8Sw1tF7SnDUye0XWiwiJlC4nryeTKtXp9tbVO1y743FEWRZ7ag==","signatures":[{"sig":"MEUCIDP79FH3wApybsU3c99K1+xwQ8VvZkMaUG7bPVJbH1QuAiEAgB3bA/4VdW9oNNc9Ita7uSOrHFuQ9TCt+uRteAi3Aew=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":114922},"main":"dist/index.js","gitHead":"48d572a6a25c6f1c0b5400c2635adc00109037bf","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.2.1","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.9.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_2.3.4_1722797874166_0.48419211328130696","host":"s3://npm-registry-packages"}},"2.3.5":{"name":"react-editable-photo-grid","version":"2.3.5","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@2.3.5","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"ae5d9c8291cc4f1e3c87be4bb8970a2bb2508c00","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-2.3.5.tgz","fileCount":14,"integrity":"sha512-nOhwY7R+Mixs0dHitL9IotbkPTxH+n1OS6sw0rqtRd81Mkt23lc6p6GZcvPEATD2dsAJVqzL3oWJhITIFKMvdg==","signatures":[{"sig":"MEYCIQD6BKbiBs+aZhkOZtxG1Tu9h8IiLQIEWv9V2r/8+8cl4gIhAPUXRrSkhQZ3/VtRpIaaoCIr1tunIll8iIctLu7uAUqw","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":116609},"main":"dist/index.js","gitHead":"48d572a6a25c6f1c0b5400c2635adc00109037bf","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.2.1","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.9.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_2.3.5_1723234378279_0.9560443630006332","host":"s3://npm-registry-packages"}},"2.3.6":{"name":"react-editable-photo-grid","version":"2.3.6","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@2.3.6","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"53f56dbbfbade497d5cd94462bbcb4b832483c93","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-2.3.6.tgz","fileCount":14,"integrity":"sha512-VMYrebS7YkN7t3bjQ2nvHrJQsg+TBbvVfuI9WHFIT/+hxzMzlkZ6j0LHpMenqHWBJPJXpE71HVyrYIKGEh3VyQ==","signatures":[{"sig":"MEYCIQDICp5ZnqCRPr9B4oRXV9yfzhwdF5RY9p5kVuMZZPjMegIhANV9f4fymnUrrom0thY5D0QXXeEIPI1kH0+NkdcbF4bC","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":116565},"main":"dist/index.js","gitHead":"48d572a6a25c6f1c0b5400c2635adc00109037bf","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.2.1","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.9.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_2.3.6_1723234697211_0.4647903893063283","host":"s3://npm-registry-packages"}},"2.3.7":{"name":"react-editable-photo-grid","version":"2.3.7","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@2.3.7","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"b9840cd8ccb7ae7d74c2c4e6bcf5d5b5db899199","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-2.3.7.tgz","fileCount":14,"integrity":"sha512-zaAOXaABoT3xPnf4COxe2ivc/HZvRCe0z4GrM6hJ2vJWDz5li3AaK+3X2/Ljuq250k+v8+QhDIHTKozGaLrKfw==","signatures":[{"sig":"MEUCIQC3UvRTe/sNQ7Dg01dUqyeVkSgD9TtIVFbVIZRagqarDQIgdVYeqn08rwA0dW0wYoNGyxFUR1a9j9bG6kALOuyouFU=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":116729},"main":"dist/index.js","gitHead":"48d572a6a25c6f1c0b5400c2635adc00109037bf","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.2.1","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.9.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_2.3.7_1723321441518_0.2821990935568468","host":"s3://npm-registry-packages"}},"3.0.0":{"name":"react-editable-photo-grid","version":"3.0.0","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@3.0.0","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"f4b429429e960aae4b2a886a031c4d13da884f63","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-3.0.0.tgz","fileCount":14,"integrity":"sha512-/PanLsi8LN9ywJC/wC5so9WMTGO17+zED3TtwLiXJ/ggilOl33eDLwFfhzAjxY0mr37KR41aR8E8JvLN8YbfUQ==","signatures":[{"sig":"MEQCIHisB7yWQ/O/wLxyz7BXmlrVCcmGLrG6HhzSJrMWppvbAiA/Gg6I3Cwwu/3+sZJc8qcK69/xQsLdlknQZpVzwjd2wg==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":114637},"main":"dist/index.js","gitHead":"37e52278c296621cc5d417f493a3f33f05cc86c9","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.8.2","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.19.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_3.0.0_1742320700866_0.8073513279456535","host":"s3://npm-registry-packages-npm-production"}},"3.0.1":{"name":"react-editable-photo-grid","version":"3.0.1","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@3.0.1","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"18dcb1d2abb04fa5b4046d69e781dcea4fe81606","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-3.0.1.tgz","fileCount":14,"integrity":"sha512-uDEPR5WCpj5P49h3cN0tQmoClKW0ViNETXYkVGuV/K72SMX5/gUoQnuX4A2SR9ehI4yI3vqgN215WIjsOpj8wQ==","signatures":[{"sig":"MEYCIQCfJ78h+jxb+83TRveU2VYTRAAr6YlHpFaM461ottLhawIhAKJ8qyba4n9O2I8YkotnxsIPe/HEW6aU45CB0Y/OS+VJ","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":115057},"main":"dist/index.js","gitHead":"8cdc06e3f0acea15f520e0cc40ddbef98735853e","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.8.2","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.19.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_3.0.1_1742321181741_0.550080189648541","host":"s3://npm-registry-packages-npm-production"}},"3.0.3":{"name":"react-editable-photo-grid","version":"3.0.3","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@3.0.3","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"f8bb1849fd865bc4ccb05e972ff9823efdefecbd","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-3.0.3.tgz","fileCount":14,"integrity":"sha512-p82iUlfMHzb7CgBHHhwCVnt26art9QvMWTSd5tyW6PiNbTjZk7221rATFF2KffMF6NZ1vdjAwhjpdKG6fUwzHA==","signatures":[{"sig":"MEQCICbMvMkyq0Ylmo3PGT/P+o8Oxuab/PlkeXiCDlFoF8efAiBvGbtjRN0hMgriuWfXgmhjeN3lVaco05pwPm0US+okFA==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":115599},"main":"dist/index.js","gitHead":"b3a0a2e9f1ceeea0dfd94f912a599724f0893b36","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.8.2","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.19.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_3.0.3_1742747104090_0.5299858132722082","host":"s3://npm-registry-packages-npm-production"}},"3.0.4":{"name":"react-editable-photo-grid","version":"3.0.4","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@3.0.4","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"51602bfff18fee798cac080037f1ed76ca743696","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-3.0.4.tgz","fileCount":14,"integrity":"sha512-qMTGM7RBXultHkGkCO9US4DDHezCEqwn8eOsAFj0aFnNFvxVZRJ8MVl4ZEwInlLZtmtuaHnkZjDZ3AsPnCeQPQ==","signatures":[{"sig":"MEYCIQDp5h3awojsmSGz7wAYgMKSxE8VSlba7b7WDc3qHzrezwIhANC4QYWVZ/pR6ny8sNch+YzJgp+b1P7tGtHnNuJgvkWe","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":115656},"main":"dist/index.js","gitHead":"0b2c1e4e04dbccd887e59d79d5f39f12b40a9a3f","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.8.2","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.19.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_3.0.4_1742747549867_0.13476929872724974","host":"s3://npm-registry-packages-npm-production"}},"3.0.5":{"name":"react-editable-photo-grid","version":"3.0.5","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@3.0.5","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"22e335460857665edf5bd1547fdd4f1c5e2f5e9c","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-3.0.5.tgz","fileCount":14,"integrity":"sha512-ih07VGjWPv23bWdKm2Dl4jsaxfHj2w59Qzi7TmPdCfsBk9vngJ8SJxHjYr5gIVS0infw1u5zS/kef/rMGb5UTA==","signatures":[{"sig":"MEUCIQDwW48uYUws3mM0ns/2ufBSj5PsayEqNabCU6bRHPlovwIgWseaHmq9qfMTbabYJzzK9keTLfg5qEWycrRtR4WndBc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":115894},"main":"dist/index.js","gitHead":"7a659f51112c68c26892d2246e7f10038af61e64","scripts":{"build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.8.2","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.20.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"webpack":"^5.93.0","ts-loader":"^9.5.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.24.9","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.24.8","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_3.0.5_1772216695913_0.405312427017269","host":"s3://npm-registry-packages-npm-production"}},"3.1.0":{"name":"react-editable-photo-grid","version":"3.1.0","keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","_id":"react-editable-photo-grid@3.1.0","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"dist":{"shasum":"04336e1e0b141da51676d29fa26e38fd0bb5e9a5","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-3.1.0.tgz","fileCount":14,"integrity":"sha512-gGXITmR13UEwb6eA3lymMKOQVKqCGufdY577f0bjl0Yrah+jbpLP+YsQtoXOJEaTyHsquw02QXGag9JcoBd7lA==","signatures":[{"sig":"MEQCIBTMSPFF9xPZcHJ6ub1wWbIR9Pp/Q5kfzf8LBA5Lm+aMAiBgyttqK9Oejp6Xs6JVN8ERWajSTOQXKHLmCuYnJbrj8w==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":120117},"main":"dist/index.js","gitHead":"588d86db71ac432fd63c29c6e50e713a0fdcd64a","scripts":{"test":"jest","build":"webpack"},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"repository":{"url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git","type":"git"},"_npmVersion":"10.8.2","description":"An editable photo grid built with React and Typescript","directories":{},"_nodeVersion":"20.20.0","dependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/react":"^18.3.3","lodash.debounce":"^4.0.8"},"_hasShrinkwrap":false,"devDependencies":{"jest":"^30.4.2","webpack":"^5.93.0","ts-loader":"^9.5.1","babel-jest":"^30.4.1","css-loader":"^7.1.2","typescript":"^5.5.3","@babel/core":"^7.29.7","webpack-cli":"^5.1.4","babel-loader":"^9.1.3","style-loader":"^4.0.0","@babel/preset-env":"^7.29.7","@babel/preset-react":"^7.24.7","@types/lodash.debounce":"^4.0.9","@babel/preset-typescript":"^7.24.7"},"peerDependencies":{"react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0","@types/node":"^20.14.10"},"_npmOperationalInternal":{"tmp":"tmp/react-editable-photo-grid_3.1.0_1780845217442_0.21588306521797573","host":"s3://npm-registry-packages-npm-production"}},"3.1.1":{"name":"react-editable-photo-grid","version":"3.1.1","description":"An editable photo grid built with React and Typescript","main":"dist/index.js","scripts":{"build":"webpack","test":"jest"},"peerDependencies":{"@types/node":"^20.14.10","react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0"},"devDependencies":{"@babel/core":"^7.29.7","@babel/preset-env":"^7.29.7","@babel/preset-react":"^7.24.7","@babel/preset-typescript":"^7.24.7","@types/lodash.debounce":"^4.0.9","babel-jest":"^30.4.1","babel-loader":"^9.1.3","css-loader":"^7.1.2","jest":"^30.4.2","style-loader":"^4.0.0","ts-loader":"^9.5.1","typescript":"^5.5.3","webpack":"^5.93.0","webpack-cli":"^5.1.4"},"repository":{"type":"git","url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git"},"keywords":["photo","grid","react","typescript"],"author":{"name":"Dominic Hart"},"license":"GPL-3.0","bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","dependencies":{"@types/react":"^18.3.3","lodash.debounce":"^4.0.8","react":"^17.0.0 || ^18.0.0","react-dom":"^17.0.0 || ^18.0.0"},"_id":"react-editable-photo-grid@3.1.1","gitHead":"da9f830fad14a12758d013e8be5ca75205ca0434","_nodeVersion":"20.20.0","_npmVersion":"10.8.2","dist":{"integrity":"sha512-cmnZ4NJoixyvQ7kzEPWYmrl+6IiyRw2moSYgCAHaghh/JApyf3oyumj1io4scqpsii3sw7KmvDCHgAmewSzzKQ==","shasum":"ca234492f50a22e4c81f143545dcdd110a18ff1a","tarball":"https://registry.npmjs.org/react-editable-photo-grid/-/react-editable-photo-grid-3.1.1.tgz","fileCount":14,"unpackedSize":120156,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIH8l1spAqHXUSjb/paqTYJl/tXIpWBtvdQg083zDDI9dAiEAxGm66vNwYCnuziUiS/gfQxRaFCnFXIsMEC8pO8gs7bE="}]},"_npmUser":{"name":"domhart","email":"dhdeveloper2@gmail.com"},"directories":{},"maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-editable-photo-grid_3.1.1_1780845418790_0.5932316742288737"},"_hasShrinkwrap":false}},"time":{"created":"2024-07-16T13:36:35.903Z","modified":"2026-06-07T15:16:59.048Z","1.0.0":"2024-07-16T13:36:36.074Z","1.0.1":"2024-07-16T13:37:35.049Z","1.0.2":"2024-07-16T13:38:17.829Z","1.0.3":"2024-07-16T14:03:41.523Z","1.0.4":"2024-07-16T14:06:36.273Z","1.0.5":"2024-07-16T14:13:01.018Z","1.0.6":"2024-07-16T14:13:44.932Z","1.0.7":"2024-07-18T15:25:57.289Z","1.0.8":"2024-07-18T15:27:57.013Z","1.1.0":"2024-07-19T13:28:36.472Z","1.1.1":"2024-07-19T13:40:18.551Z","1.1.2":"2024-07-19T13:44:33.570Z","1.1.3":"2024-07-19T13:46:56.134Z","1.1.4":"2024-07-19T14:47:19.686Z","1.2.0":"2024-07-19T15:14:47.055Z","1.2.1":"2024-07-19T20:55:18.008Z","1.2.2":"2024-07-19T20:57:09.862Z","1.2.3":"2024-07-19T21:02:34.699Z","1.2.4":"2024-07-19T23:00:17.274Z","1.2.5":"2024-07-19T23:24:35.682Z","1.2.6":"2024-07-20T17:21:05.158Z","1.2.7":"2024-07-20T17:23:50.664Z","1.2.8":"2024-07-20T17:29:41.956Z","1.3.0":"2024-07-20T17:43:12.048Z","1.3.1":"2024-07-20T17:47:00.095Z","1.3.2":"2024-07-20T21:49:21.410Z","1.3.3":"2024-07-20T22:19:12.678Z","1.3.4":"2024-07-20T22:35:37.814Z","1.3.5":"2024-07-20T22:37:21.824Z","1.3.6":"2024-07-20T22:43:58.239Z","1.3.7":"2024-07-20T22:45:33.928Z","1.3.8":"2024-07-20T22:48:15.927Z","1.3.9":"2024-07-20T22:51:31.109Z","1.4.0":"2024-07-20T22:53:50.424Z","1.4.1":"2024-07-20T22:55:53.489Z","1.4.2":"2024-07-20T22:57:09.887Z","1.4.3":"2024-07-20T23:08:07.840Z","1.4.4":"2024-07-21T12:51:47.791Z","1.4.5":"2024-07-21T12:55:19.775Z","1.4.6":"2024-07-21T13:00:34.409Z","1.4.7":"2024-07-21T13:02:44.802Z","1.4.8":"2024-07-21T13:40:22.695Z","1.4.9":"2024-07-21T13:41:19.089Z","1.5.0":"2024-07-21T13:42:38.322Z","1.5.1":"2024-07-21T13:45:35.316Z","1.5.2":"2024-07-21T13:47:03.033Z","1.5.3":"2024-07-21T13:48:32.915Z","1.5.5":"2024-07-21T14:44:44.386Z","1.5.6":"2024-07-21T15:17:10.170Z","1.6.0":"2024-07-21T15:19:45.311Z","1.6.1":"2024-07-22T16:49:05.020Z","1.6.2":"2024-07-22T16:59:27.313Z","1.6.3":"2024-07-28T14:41:32.479Z","1.6.4":"2024-07-28T14:54:18.666Z","1.6.5":"2024-07-28T14:57:14.196Z","1.6.6":"2024-07-28T14:59:58.622Z","1.6.7":"2024-07-28T16:25:50.909Z","1.6.8":"2024-07-28T16:33:33.692Z","1.6.9":"2024-07-28T16:39:42.239Z","1.7.0":"2024-07-28T16:42:36.134Z","1.7.1":"2024-07-28T16:46:12.703Z","1.7.2":"2024-07-28T16:47:37.638Z","1.7.3":"2024-07-28T16:51:23.264Z","1.8.0":"2024-08-03T13:05:11.604Z","1.8.1":"2024-08-03T13:11:19.693Z","1.8.2":"2024-08-03T13:17:40.722Z","1.8.3":"2024-08-03T13:20:15.979Z","1.8.4":"2024-08-03T13:22:18.841Z","1.8.5":"2024-08-03T13:24:23.793Z","1.8.6":"2024-08-03T13:26:10.175Z","1.8.7":"2024-08-03T13:28:21.510Z","1.8.8":"2024-08-03T13:31:00.568Z","1.8.9":"2024-08-03T13:34:19.932Z","1.9.0":"2024-08-03T13:37:45.117Z","1.9.1":"2024-08-03T13:46:16.997Z","1.9.2":"2024-08-03T13:49:20.737Z","1.9.3":"2024-08-03T13:51:23.933Z","1.9.4":"2024-08-03T13:53:34.686Z","1.9.5":"2024-08-03T13:57:46.346Z","1.9.6":"2024-08-03T14:00:46.882Z","1.9.7":"2024-08-03T14:01:58.623Z","1.9.8":"2024-08-03T14:08:58.782Z","1.9.9":"2024-08-03T14:21:15.582Z","2.0.0":"2024-08-03T14:23:22.124Z","2.0.1":"2024-08-03T14:26:49.762Z","2.1.0":"2024-08-03T14:37:56.071Z","2.1.1":"2024-08-03T14:52:22.068Z","2.1.2":"2024-08-03T14:53:29.944Z","2.1.3":"2024-08-03T15:14:20.675Z","2.1.4":"2024-08-03T15:15:53.309Z","2.1.5":"2024-08-03T15:17:09.998Z","2.1.6":"2024-08-03T15:20:18.288Z","2.1.7":"2024-08-03T15:32:32.205Z","2.1.8":"2024-08-03T15:35:26.938Z","2.1.9":"2024-08-03T15:38:10.916Z","2.2.0":"2024-08-03T15:39:38.208Z","2.2.1":"2024-08-03T15:45:56.615Z","2.2.2":"2024-08-03T21:28:57.755Z","2.2.3":"2024-08-03T21:41:01.586Z","2.2.4":"2024-08-03T21:44:03.076Z","2.2.5":"2024-08-03T21:56:49.115Z","2.2.6":"2024-08-03T22:00:51.021Z","2.3.0":"2024-08-04T17:05:34.080Z","2.3.1":"2024-08-04T18:48:21.613Z","2.3.2":"2024-08-04T18:51:07.930Z","2.3.3":"2024-08-04T18:52:56.283Z","2.3.4":"2024-08-04T18:57:54.401Z","2.3.5":"2024-08-09T20:12:58.454Z","2.3.6":"2024-08-09T20:18:17.397Z","2.3.7":"2024-08-10T20:24:01.678Z","3.0.0":"2025-03-18T17:58:21.037Z","3.0.1":"2025-03-18T18:06:21.956Z","3.0.2":"2025-03-23T16:23:43.081Z","3.0.3":"2025-03-23T16:25:04.279Z","3.0.4":"2025-03-23T16:32:30.093Z","3.0.5":"2026-02-27T18:24:56.062Z","3.1.0":"2026-06-07T15:13:37.589Z","3.1.1":"2026-06-07T15:16:58.929Z"},"bugs":{"url":"https://github.com/DominicHart/react-editable-photo-grid/issues"},"author":{"name":"Dominic Hart"},"license":"GPL-3.0","homepage":"https://github.com/DominicHart/react-editable-photo-grid#readme","keywords":["photo","grid","react","typescript"],"repository":{"type":"git","url":"git+ssh://git@github.com/DominicHart/react-editable-photo-grid.git"},"description":"An editable photo grid built with React and Typescript","maintainers":[{"name":"domhart","email":"dhdeveloper2@gmail.com"}],"readme":"# react-editable-photo-grid\n\nAn editable photo grid for react applications.\n```tsx\nimport React, { useState, useEffect }  from 'react';\nimport { PhotoGrid, PhotoRows } from 'react-editable-photo-grid';\n\nconst Photos: React.FC = () => {\n    const [photos, setPhotos] = useState<PhotoRows>({}),\n        [changes, setChanges] = useState<Number>(0),\n        [selectedPhotos, setSelectedPhotos] = useState<Array<string>>([]);\n\n    const getData = () => {\n        // Fetch photos from API and update state\n    }\n\n    useEffect(() => {\n        getData();\n    }, []);\n\n    return (\n      <PhotoGrid\n        isEditing={true}\n        rows={photos}\n        updateRows={setPhotos}\n        selectedPhotos={selectedPhotos}\n        updateSelectedPhotos={setSelectedPhotos}\n        changes={changes}\n        increaseChanges={() => setChanges(changes + 1)}\n        imageSrcPrefix=\"/api/image\"\n        imageSrcProperty=\"thumbnail_path\"\n      />\n    );\n}\n\nexport default Photos;\n```\n\n## How to Install\n```\nnpm i react-editable-photo-grid\n```\n\n## Required Props\n\nProperties | Type | Description\n------------ | ------------- | -------------\nisEditing | Boolean | Switches the grid from display to editable\nrows | PhotoRows | An array of rows where the keys are row numbers and items are photo arrays.\nupdateRows | Void | A method that updates the rows data from the parent\nselectedPhotos | Array<string> | This can be populated with photo ids for batch operations\nupdateSelectedPhotos | Void | A method to update the selectedPhotos prop\nchanges | Number | Tracks when changes have been made (the editable part)\nincreaseChanges | Void | A method to update the changes prop\nimageSrcPrefix | String | A string that represents the url prefix for each photo image src attribute. This will be used for the grid and gallery.\nimageSrcProperty | String | Determines which photo property is used for the grid img src parameter.\nuseGallery | Boolean | Activate the Gallery component.\nbuttonArrows | ButtonArrows | Allows you to override the basic button arrows with custom html.\ngallerySrcProperty | String | Determines which photo property is used for the gallery image src parameter.\ngalleryButtonArrows | GalleryButtonArrows | Allows you to override the gallery prev and next button arrows with custom html.\nonPhotoClick | Void | A method that receives the photo id on click\nonGallerySwipe | Void | A method that receives a photo object when the gallery is swiped\ngalleryType | String | Determines if the legacy gallery or the scroll gallery (beta) is to be used\nphotoMenu | ReactElement | Accepts any React component to appear on hover when in edit mode\nphotoActions | ReactElement | Accepts any React component to appear on hover when not in edit mode\n\n## How to Use\n\nTo use the PhotoGrid component you can import it like this:\n```tsx\nimport { PhotoGrid, PhotoRows, PhotoItem, sortPhotosIntoRows } from 'react-editable-photo-grid';\nimport { getPhotos } from 'api';\n```\nPhotoGrid represents the component and PhotoRows is the TS type for the data.\nYou can add the component to your code like this:\n```tsx\n    const [photos, setPhotos] = useState<PhotoItem[]>([]),\n      [rows, setRows] = useState<PhotoRows[]>({})\n\n    const loadPhotos = (): void => {\n      const photos = await getPhotos();\n      setPhotos(photos);\n      setRows(sortPhotosIntoRows(photos));\n    }\n\n    return (\n      <PhotoGrid\n        isEditing={true}\n        photos={photos}\n        rows={rows}\n        updateRows={setRows}\n        selectedPhotos={selectedPhotos}\n        updateSelectedPhotos={setSelectedPhotos}\n        changes={changes}\n        increaseChanges={() => setChanges(changes + 1)}\n        imageSrcPrefix=\"/api/image\"\n        imageSrcProperty=\"/thumbnail_path\"\n      />\n    );\n```\n### How data should be structured\n\nStructure the data for the PhotoGrid like this:\n\n```tsx\nexport interface PhotoRows {\n  [key: number]: PhotoItem[];\n}\n\nexport interface PhotoItem {\n  id: string;\n  column: number;\n  image_path: string;\n  thumbnail_path: string;\n  carousel_key: number;\n  width: number;\n  height: number;\n}\n```\n\nPhotoItem represents a single photo data object. PhotoRows is an associative array where each key is a row number and items an array of associated photos.\n\n### Passing a custom dropdown menu\n\nYou can add a menu to the grid by passing a component as the photoMenu prop. The grid will clone this prop and add it to each photo. There isn't a set format that a menu has to be but here is an example:\n\n```tsx\nconst PhotoMenu = (props: PhotoMenuProps) => {\n  return (\n    <div className=\"photomenu\">\n      <Checkbox\n        value={props.photo.id}\n        onClick={props.updateSelectedPhotos}\n        checked={props.selectedPhotos.includes(props.photo.id)}\n      />\n      <div>\n        <button\n          data-key={props.photo.id}\n          type=\"button\"\n          onClick={props.openDropdown}\n        >\n          Edit\n        </button>\n        <ul\n          style={{ display: props.activeDropdown ===    props.photo.id ? 'block' : 'none' }}\n        >\n          <li>\n            <a\n              href={props.photo.id}\n              onClick={props.edit}>\n              Edit\n              </a>\n          </li>\n        </ul>\n      </div>\n    </div>\n  );\n};\n```\n\nAnd here is how you can prepare it for the grid:\n\n```tsx\n  const photoMenu = <PhotoMenu\n    selectedPhotos={selectedPhotos}\n    updateSelectedPhotos={updateSelectedPhotos}\n    activeDropdown={activeDropdown}\n    openDropdown={openDropdown}\n    edit={edit}\n  />\n```\n\nYou can then pass photoMenu to the grid as a prop. See the sample component for more details.\n\n### Passing custom photo actions\nYou can add actions to the grid by passing a component as the photoActions prop. The grid will clone this prop and add it to each photo. There isn't a set format that a menu has to be but here is an example:\n\n```tsx\nconst PhotoActions: React.FC<Props> = ({ photo, addToBasket }) => {\n    const addPhotoToBasket = (e: React.MouseEvent<HTMLButtonElement>): void => {\n        e.preventDefault();\n        const id = e.currentTarget.dataset.id||undefined;\n        if (!id) return;\n        addToBasket(id);\n    }\n\n    return (\n        <div className=\"photogrid--photo__actions\">\n            <ul>\n                <li>\n                    <button \n                        type=\"button\" \n                        onClick={addPhotoToBasket}\n                    >\n                        Buy\n                    </button>\n                </li>\n            </ul>\n        </div>\n    );\n}\n```\n\nAnd here is how you can prepare it for the grid:\n\n```tsx\n  const photoActions = <PhotoActions\n    addToBasket={addToBasket}\n  />\n```\n\nYou can then pass photoActions to the grid as a prop. See the sample component for more details.\n\n### Using the gallery\n\nYou can enable the gallery by passing the the required props like this:\n\n```tsx\n  <PhotoGrid\n    { ... other props}\n    useGallery={true}\n    gallerySrcProperty=\"image_path\"\n  />\n```\n\nThis will make the gallery appear when a photo is clicked.\n\n## Examples\n\nSee the samples directory for sample usage.\n\n## How is it editable?\n\nThe PhotoGrid component allows you to structure your photos in rows and columns. As such it provides controls to change the position of the rows within the page and the columns within the rows. Each time an edit is made it updates the rows prop. It also increases the changes prop.\n\nYou can use the changes prop to work out if any edits have been made. You can then submit your edits to your API to permanently store the changes. The easiest way to achieve this is to add 'row' and 'column' properties to the data handled by your API.","readmeFilename":"README.md"}