Basic CSS Grid based video grid demo

This commit is contained in:
Robert Long
2021-08-11 16:02:40 -07:00
parent 6addd838b4
commit f9d799ff05
5 changed files with 258 additions and 2 deletions

130
package-lock.json generated
View File

@@ -7,13 +7,15 @@
"": {
"version": "0.0.0",
"dependencies": {
"@react-spring/web": "^9.2.4",
"classnames": "^2.3.1",
"color-hash": "^2.0.1",
"events": "^3.3.0",
"matrix-js-sdk": "^12.0.1",
"react": "^17.0.0",
"react-dom": "^17.0.0",
"react-router-dom": "^5.2.0"
"react-router-dom": "^5.2.0",
"react-use-gesture": "^9.1.3"
},
"devDependencies": {
"@vitejs/plugin-react-refresh": "^1.3.1",
@@ -390,6 +392,69 @@
"node": ">=6.9.0"
}
},
"node_modules/@react-spring/animated": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/animated/-/animated-9.2.4.tgz",
"integrity": "sha512-AfV6ZM8pCCAT29GY5C8/1bOPjZrv/7kD0vedjiE/tEYvNDwg9GlscrvsTViWR2XykJoYrDfdkYArrldWpsCJ5g==",
"dependencies": {
"@react-spring/shared": "~9.2.0",
"@react-spring/types": "~9.2.0"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0"
}
},
"node_modules/@react-spring/core": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/core/-/core-9.2.4.tgz",
"integrity": "sha512-R+PwyfsjiuYCWqaTTfCpYpRmsP0h87RNm7uxC1Uxy7QAHUfHEm2sAHn+AdHPwq/MbVwDssVT8C5yf2WGcqiXGg==",
"hasInstallScript": true,
"dependencies": {
"@react-spring/animated": "~9.2.0",
"@react-spring/shared": "~9.2.0",
"@react-spring/types": "~9.2.0"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0"
}
},
"node_modules/@react-spring/rafz": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/rafz/-/rafz-9.2.4.tgz",
"integrity": "sha512-SOKf9eue+vAX+DGo7kWYNl9i9J3gPUlQjifIcV9Bzw9h3i30wPOOP0TjS7iMG/kLp2cdHQYDNFte6nt23VAZkQ=="
},
"node_modules/@react-spring/shared": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/shared/-/shared-9.2.4.tgz",
"integrity": "sha512-ZEr4l2BxmyFRUvRA2VCkPfCJii4E7cGkwbjmTBx1EmcGrOnde/V2eF5dxqCTY3k35QuCegkrWe0coRJVkh8q2Q==",
"dependencies": {
"@react-spring/rafz": "~9.2.0",
"@react-spring/types": "~9.2.0"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0"
}
},
"node_modules/@react-spring/types": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/types/-/types-9.2.4.tgz",
"integrity": "sha512-zHUXrWO8nweUN/ISjrjqU7GgXXvoEbFca1CgiE0TY0H/dqJb3l+Rhx8ecPVNYimzFg3ZZ1/T0egpLop8SOv4aA=="
},
"node_modules/@react-spring/web": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/web/-/web-9.2.4.tgz",
"integrity": "sha512-vtPvOalLFvuju/MDBtoSnCyt0xXSL6Amyv82fljOuWPl1yGd4M1WteijnYL9Zlriljl0a3oXcPunAVYTD9dbDQ==",
"dependencies": {
"@react-spring/animated": "~9.2.0",
"@react-spring/core": "~9.2.0",
"@react-spring/shared": "~9.2.0",
"@react-spring/types": "~9.2.0"
},
"peerDependencies": {
"react": "^16.8.0 || ^17.0.0",
"react-dom": "^16.8.0 || ^17.0.0"
}
},
"node_modules/@rollup/pluginutils": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.1.0.tgz",
@@ -1328,6 +1393,14 @@
"react": ">=15"
}
},
"node_modules/react-use-gesture": {
"version": "9.1.3",
"resolved": "https://registry.npmjs.org/react-use-gesture/-/react-use-gesture-9.1.3.tgz",
"integrity": "sha512-CdqA2SmS/fj3kkS2W8ZU8wjTbVBAIwDWaRprX7OKaj7HlGwBasGEFggmk5qNklknqk9zK/h8D355bEJFTpqEMg==",
"peerDependencies": {
"react": ">= 16.8.0"
}
},
"node_modules/regenerator-runtime": {
"version": "0.13.7",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz",
@@ -1891,6 +1964,55 @@
"to-fast-properties": "^2.0.0"
}
},
"@react-spring/animated": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/animated/-/animated-9.2.4.tgz",
"integrity": "sha512-AfV6ZM8pCCAT29GY5C8/1bOPjZrv/7kD0vedjiE/tEYvNDwg9GlscrvsTViWR2XykJoYrDfdkYArrldWpsCJ5g==",
"requires": {
"@react-spring/shared": "~9.2.0",
"@react-spring/types": "~9.2.0"
}
},
"@react-spring/core": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/core/-/core-9.2.4.tgz",
"integrity": "sha512-R+PwyfsjiuYCWqaTTfCpYpRmsP0h87RNm7uxC1Uxy7QAHUfHEm2sAHn+AdHPwq/MbVwDssVT8C5yf2WGcqiXGg==",
"requires": {
"@react-spring/animated": "~9.2.0",
"@react-spring/shared": "~9.2.0",
"@react-spring/types": "~9.2.0"
}
},
"@react-spring/rafz": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/rafz/-/rafz-9.2.4.tgz",
"integrity": "sha512-SOKf9eue+vAX+DGo7kWYNl9i9J3gPUlQjifIcV9Bzw9h3i30wPOOP0TjS7iMG/kLp2cdHQYDNFte6nt23VAZkQ=="
},
"@react-spring/shared": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/shared/-/shared-9.2.4.tgz",
"integrity": "sha512-ZEr4l2BxmyFRUvRA2VCkPfCJii4E7cGkwbjmTBx1EmcGrOnde/V2eF5dxqCTY3k35QuCegkrWe0coRJVkh8q2Q==",
"requires": {
"@react-spring/rafz": "~9.2.0",
"@react-spring/types": "~9.2.0"
}
},
"@react-spring/types": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/types/-/types-9.2.4.tgz",
"integrity": "sha512-zHUXrWO8nweUN/ISjrjqU7GgXXvoEbFca1CgiE0TY0H/dqJb3l+Rhx8ecPVNYimzFg3ZZ1/T0egpLop8SOv4aA=="
},
"@react-spring/web": {
"version": "9.2.4",
"resolved": "https://registry.npmjs.org/@react-spring/web/-/web-9.2.4.tgz",
"integrity": "sha512-vtPvOalLFvuju/MDBtoSnCyt0xXSL6Amyv82fljOuWPl1yGd4M1WteijnYL9Zlriljl0a3oXcPunAVYTD9dbDQ==",
"requires": {
"@react-spring/animated": "~9.2.0",
"@react-spring/core": "~9.2.0",
"@react-spring/shared": "~9.2.0",
"@react-spring/types": "~9.2.0"
}
},
"@rollup/pluginutils": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-4.1.0.tgz",
@@ -2610,6 +2732,12 @@
"tiny-warning": "^1.0.0"
}
},
"react-use-gesture": {
"version": "9.1.3",
"resolved": "https://registry.npmjs.org/react-use-gesture/-/react-use-gesture-9.1.3.tgz",
"integrity": "sha512-CdqA2SmS/fj3kkS2W8ZU8wjTbVBAIwDWaRprX7OKaj7HlGwBasGEFggmk5qNklknqk9zK/h8D355bEJFTpqEMg==",
"requires": {}
},
"regenerator-runtime": {
"version": "0.13.7",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz",