diff --git a/javascript/grid-ui/.eslintrc.cjs b/javascript/grid-ui/.eslintrc.cjs index efe315a4621fa..2ac731626c20b 100644 --- a/javascript/grid-ui/.eslintrc.cjs +++ b/javascript/grid-ui/.eslintrc.cjs @@ -1,5 +1,5 @@ module.exports = { extends: [ 'react-app' - ], + ] } diff --git a/javascript/grid-ui/BUILD.bazel b/javascript/grid-ui/BUILD.bazel index f5a06951efdb3..6c3c8085bb6af 100644 --- a/javascript/grid-ui/BUILD.bazel +++ b/javascript/grid-ui/BUILD.bazel @@ -8,8 +8,11 @@ _RUNTIME_DEPS = [ ":copy_static_files", "@npm//@apollo/client", "@npm//@babel/preset-react", - "@npm//@material-ui/core", - "@npm//@material-ui/icons", + "@npm//@emotion/react", + "@npm//@emotion/styled", + "@npm//@mui/icons-material", + "@npm//@mui/material", + "@npm//@mui/styles", "@npm//@novnc/novnc", "@npm//clsx", "@npm//graphql", diff --git a/javascript/grid-ui/package-lock.json b/javascript/grid-ui/package-lock.json index 44d4009dbc411..15a29578c2a20 100644 --- a/javascript/grid-ui/package-lock.json +++ b/javascript/grid-ui/package-lock.json @@ -9,8 +9,11 @@ "version": "0.1.0", "dependencies": { "@apollo/client": "^3.5.10", - "@material-ui/core": "^4.11.4", - "@material-ui/icons": "^4.11.2", + "@emotion/react": "^11.9.0", + "@emotion/styled": "^11.8.1", + "@mui/icons-material": "^5.6.1", + "@mui/material": "^5.6.1", + "@mui/styles": "^5.6.1", "@novnc/novnc": "^1.2.0", "@types/react": "^17.0.43", "@types/react-dom": "^17.0.14", @@ -393,7 +396,6 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz", "integrity": "sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==", - "dev": true, "engines": { "node": ">=6.9.0" } @@ -963,7 +965,6 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.16.7.tgz", "integrity": "sha512-Esxmk7YjA8QysKeT3VhTXvF6y77f/a91SIs4pWb4H2eWGQkCKFgQaG6hdoEVZtGsrAcb2K5BW66XsOErD4WU3Q==", - "dev": true, "dependencies": { "@babel/helper-plugin-utils": "^7.16.7" }, @@ -2087,11 +2088,157 @@ "postcss": "^8.3" } }, + "node_modules/@emotion/babel-plugin": { + "version": "11.9.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz", + "integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==", + "dependencies": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "peerDependencies": { + "@babel/core": "^7.0.0" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "dependencies": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, "node_modules/@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" }, + "node_modules/@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "dependencies": { + "@emotion/memoize": "^0.7.4" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "node_modules/@emotion/react": { + "version": "11.9.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.0.tgz", + "integrity": "sha512-lBVSF5d0ceKtfKCDQJveNAtkC7ayxpVlgOohLgXqRwqWr9bOf4TZAFFyIcNngnV6xK6X4x2ZeXq7vliHkoVkxQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.3", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/serialize": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.3.tgz", + "integrity": "sha512-2mSSvgLfyV3q+iVh3YWgNlUc2a9ZlDU7DjuP5MjK3AXRR0dYigCrP99aeFtaB2L/hjfEZdSThn5dsZ0ufqbvsA==", + "dependencies": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + } + }, + "node_modules/@emotion/serialize/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "node_modules/@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "@emotion/react": "^11.0.0-rc.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "node_modules/@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "node_modules/@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "node_modules/@eslint/eslintrc": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.2.1.tgz", @@ -2925,57 +3072,131 @@ "integrity": "sha512-nkalE/f1RvRGChwBnEIoBfSEYOXnCRdleKuv6+lePbMDrMZXeDQnqak5XDOeBgrPPyPfAdcCu/B5z+v3VhplGg==", "dev": true }, - "node_modules/@material-ui/core": { - "version": "4.12.4", - "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.12.4.tgz", - "integrity": "sha512-tr7xekNlM9LjA6pagJmL8QCgZXaubWUwkJnoYcMKd4gw/t4XiyvnTkjdGrUVicyB2BsdaAv1tvow45bPM4sSwQ==", + "node_modules/@mui/base": { + "version": "5.0.0-alpha.76", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.76.tgz", + "integrity": "sha512-Pd0l4DvjXiGRyipn/CTDlYB2XrJwhpLktVXvbvcmzL2SMDaNprSarZqBkPHIubkulmRDZEEcnFDrpKgeSJDg4A==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@emotion/is-prop-valid": "^1.1.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@popperjs/core": "^2.11.5", + "clsx": "^1.1.1", + "prop-types": "^15.7.2", + "react-is": "^17.0.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/icons-material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.6.1.tgz", + "integrity": "sha512-I1x8u+FRLOmoJpRJASMx9UG+jZrSkNLyRQmBXivQQwXu3m3iasMoaKYhhI0J18t8+FWktbkNTp63oEUHE9Gw0Q==", + "dependencies": { + "@babel/runtime": "^7.17.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@mui/material": "^5.0.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.6.1.tgz", + "integrity": "sha512-xg6pPq+1jxWupwmPpnfmsHNjrsOe2xynUQWrRfcH8WHrrr1sQulq0VF4gORq/l8DD8a/jb4s8SsC20e/e6mHKQ==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/styles": "^4.11.5", - "@material-ui/system": "^4.12.2", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "@types/react-transition-group": "^4.2.0", - "clsx": "^1.0.4", + "@babel/runtime": "^7.17.2", + "@mui/base": "5.0.0-alpha.76", + "@mui/system": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "popper.js": "1.16.1-lts", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0", - "react-transition-group": "^4.4.0" + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, "@types/react": { "optional": true } } }, - "node_modules/@material-ui/icons": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.3.tgz", - "integrity": "sha512-IKHlyx6LDh8n19vzwH5RtHIOHl9Tu90aAAxcbWME6kp4dmvODM3UvOHJeMIDzUbd4muuJKHmlNoBN+mDY4XkBA==", + "node_modules/@mui/material/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@mui/private-theming": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.6.1.tgz", + "integrity": "sha512-8lgh+tUt/3ftStfvml3dwAzhW3fe/cUFjLcBViOTnWk7UixWR79me4qehsO4NVj0THpu3d2qclrLzdD8qBAWAQ==", "dependencies": { - "@babel/runtime": "^7.4.4" + "@babel/runtime": "^7.17.2", + "@mui/utils": "^5.6.1", + "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@material-ui/core": "^4.0.0", - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -2983,39 +3204,69 @@ } } }, - "node_modules/@material-ui/styles": { - "version": "4.11.5", - "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.5.tgz", - "integrity": "sha512-o/41ot5JJiUsIETME9wVLAJrmIWL3j0R0Bj2kCOLbSfqEkKf0fmaPt+5vtblUh5eXr2S+J/8J3DaCb10+CzPGA==", + "node_modules/@mui/styled-engine": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.6.1.tgz", + "integrity": "sha512-jEhH6TBY8jc9S8yVncXmoTYTbATjEu44RMFXj6sIYfKr5NArVwTwRo3JexLL0t3BOAiYM4xsFLgfKEIvB9SAeQ==", "dependencies": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.7.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@emotion/react": "^11.4.1", + "@emotion/styled": "^11.3.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + } + } + }, + "node_modules/@mui/styles": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-5.6.1.tgz", + "integrity": "sha512-4BrlZIKG5vp5gKpiyKvcSGka/VBUyEI/59WnCxPU2RxNT0WLkoGlRKTU5NO+e+Ng8h7sLR9BF6yglDhMhtUJ0Q==", + "dependencies": { + "@babel/runtime": "^7.17.2", "@emotion/hash": "^0.8.0", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "clsx": "^1.0.4", - "csstype": "^2.5.2", + "@mui/private-theming": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "jss": "^10.5.1", - "jss-plugin-camel-case": "^10.5.1", - "jss-plugin-default-unit": "^10.5.1", - "jss-plugin-global": "^10.5.1", - "jss-plugin-nested": "^10.5.1", - "jss-plugin-props-sort": "^10.5.1", - "jss-plugin-rule-value-function": "^10.5.1", - "jss-plugin-vendor-prefixer": "^10.5.1", + "jss": "^10.8.2", + "jss-plugin-camel-case": "^10.8.2", + "jss-plugin-default-unit": "^10.8.2", + "jss-plugin-global": "^10.8.2", + "jss-plugin-nested": "^10.8.2", + "jss-plugin-props-sort": "^10.8.2", + "jss-plugin-rule-value-function": "^10.8.2", + "jss-plugin-vendor-prefixer": "^10.8.2", "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@types/react": "^17.0.0", + "react": "^17.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -3023,38 +3274,59 @@ } } }, - "node_modules/@material-ui/system": { - "version": "4.12.2", - "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.2.tgz", - "integrity": "sha512-6CSKu2MtmiJgcCGf6nBQpM8fLkuB9F55EKfbdTC80NND5wpTmKzwdhLYLH3zL4cLlK0gVaaltW7/wMuyTnN0Lw==", - "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.3", - "csstype": "^2.5.2", + "node_modules/@mui/styles/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@mui/system": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.6.1.tgz", + "integrity": "sha512-Y5pDvEOK6VOY+0vgNeyDuEEO5QCinhXbZQDyLOlaGLKuAoRGLXO9pcSsjZoGkewYZitXD44EDfgBQ+BqsAfgUA==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@mui/private-theming": "^5.6.1", + "@mui/styled-engine": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, "@types/react": { "optional": true } } }, - "node_modules/@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "node_modules/@mui/system/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@mui/types": { + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.3.tgz", + "integrity": "sha512-DDF0UhMBo4Uezlk+6QxrlDbchF79XG6Zs0zIewlR4c0Dt6GKVFfUtzPtHCH1tTbcSlq/L2bGEdiaoHBJ9Y1gSA==", "peerDependencies": { "@types/react": "*" }, @@ -3064,21 +3336,26 @@ } } }, - "node_modules/@material-ui/utils": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz", - "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==", + "node_modules/@mui/utils": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.6.1.tgz", + "integrity": "sha512-CPrzrkiBusCZBLWu0Sg5MJvR3fKJyK3gKecLVX012LULyqg2U64Oz04BKhfkbtBrPBbSQxM+DWW9B1c9hmV9nQ==", "dependencies": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@types/prop-types": "^15.7.4", + "@types/react-is": "^16.7.1 || ^17.0.0", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react": "^17.0.0 || ^18.0.0" } }, "node_modules/@nodelib/fs.scandir": { @@ -3180,6 +3457,15 @@ "node": ">= 8" } }, + "node_modules/@popperjs/core": { + "version": "2.11.5", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", + "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -4051,6 +4337,14 @@ "@types/react": "^17" } }, + "node_modules/@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/react-modal": { "version": "3.13.1", "resolved": "https://registry.npmjs.org/@types/react-modal/-/react-modal-3.13.1.tgz", @@ -6653,11 +6947,6 @@ "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==", "dev": true }, - "node_modules/csstype": { - "version": "2.6.20", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.20.tgz", - "integrity": "sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==" - }, "node_modules/damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -8448,6 +8737,11 @@ "url": "https://github.com/avajs/find-cache-dir?sponsor=1" } }, + "node_modules/find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -13367,11 +13661,6 @@ "node": ">=4" } }, - "node_modules/popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" - }, "node_modules/portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -16563,6 +16852,11 @@ "postcss": "^8.2.15" } }, + "node_modules/stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "node_modules/supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", @@ -19288,8 +19582,7 @@ "@babel/helper-plugin-utils": { "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz", - "integrity": "sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==", - "dev": true + "integrity": "sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==" }, "@babel/helper-remap-async-to-generator": { "version": "7.16.8", @@ -19673,7 +19966,6 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.16.7.tgz", "integrity": "sha512-Esxmk7YjA8QysKeT3VhTXvF6y77f/a91SIs4pWb4H2eWGQkCKFgQaG6hdoEVZtGsrAcb2K5BW66XsOErD4WU3Q==", - "dev": true, "requires": { "@babel/helper-plugin-utils": "^7.16.7" } @@ -20419,11 +20711,127 @@ "postcss-value-parser": "^4.2.0" } }, + "@emotion/babel-plugin": { + "version": "11.9.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz", + "integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==", + "requires": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "dependencies": { + "escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==" + } + } + }, + "@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "requires": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, "@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" }, + "@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "requires": { + "@emotion/memoize": "^0.7.4" + } + }, + "@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "@emotion/react": { + "version": "11.9.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.0.tgz", + "integrity": "sha512-lBVSF5d0ceKtfKCDQJveNAtkC7ayxpVlgOohLgXqRwqWr9bOf4TZAFFyIcNngnV6xK6X4x2ZeXq7vliHkoVkxQ==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.3", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + } + }, + "@emotion/serialize": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.3.tgz", + "integrity": "sha512-2mSSvgLfyV3q+iVh3YWgNlUc2a9ZlDU7DjuP5MjK3AXRR0dYigCrP99aeFtaB2L/hjfEZdSThn5dsZ0ufqbvsA==", + "requires": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } + } + }, + "@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + } + }, + "@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "@eslint/eslintrc": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-1.2.1.tgz", @@ -21057,81 +21465,144 @@ "integrity": "sha512-nkalE/f1RvRGChwBnEIoBfSEYOXnCRdleKuv6+lePbMDrMZXeDQnqak5XDOeBgrPPyPfAdcCu/B5z+v3VhplGg==", "dev": true }, - "@material-ui/core": { - "version": "4.12.4", - "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.12.4.tgz", - "integrity": "sha512-tr7xekNlM9LjA6pagJmL8QCgZXaubWUwkJnoYcMKd4gw/t4XiyvnTkjdGrUVicyB2BsdaAv1tvow45bPM4sSwQ==", + "@mui/base": { + "version": "5.0.0-alpha.76", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.76.tgz", + "integrity": "sha512-Pd0l4DvjXiGRyipn/CTDlYB2XrJwhpLktVXvbvcmzL2SMDaNprSarZqBkPHIubkulmRDZEEcnFDrpKgeSJDg4A==", "requires": { - "@babel/runtime": "^7.4.4", - "@material-ui/styles": "^4.11.5", - "@material-ui/system": "^4.12.2", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "@types/react-transition-group": "^4.2.0", - "clsx": "^1.0.4", + "@babel/runtime": "^7.17.2", + "@emotion/is-prop-valid": "^1.1.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@popperjs/core": "^2.11.5", + "clsx": "^1.1.1", + "prop-types": "^15.7.2", + "react-is": "^17.0.2" + } + }, + "@mui/icons-material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.6.1.tgz", + "integrity": "sha512-I1x8u+FRLOmoJpRJASMx9UG+jZrSkNLyRQmBXivQQwXu3m3iasMoaKYhhI0J18t8+FWktbkNTp63oEUHE9Gw0Q==", + "requires": { + "@babel/runtime": "^7.17.2" + } + }, + "@mui/material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.6.1.tgz", + "integrity": "sha512-xg6pPq+1jxWupwmPpnfmsHNjrsOe2xynUQWrRfcH8WHrrr1sQulq0VF4gORq/l8DD8a/jb4s8SsC20e/e6mHKQ==", + "requires": { + "@babel/runtime": "^7.17.2", + "@mui/base": "5.0.0-alpha.76", + "@mui/system": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "popper.js": "1.16.1-lts", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0", - "react-transition-group": "^4.4.0" + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } } }, - "@material-ui/icons": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.3.tgz", - "integrity": "sha512-IKHlyx6LDh8n19vzwH5RtHIOHl9Tu90aAAxcbWME6kp4dmvODM3UvOHJeMIDzUbd4muuJKHmlNoBN+mDY4XkBA==", + "@mui/private-theming": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.6.1.tgz", + "integrity": "sha512-8lgh+tUt/3ftStfvml3dwAzhW3fe/cUFjLcBViOTnWk7UixWR79me4qehsO4NVj0THpu3d2qclrLzdD8qBAWAQ==", "requires": { - "@babel/runtime": "^7.4.4" + "@babel/runtime": "^7.17.2", + "@mui/utils": "^5.6.1", + "prop-types": "^15.7.2" } }, - "@material-ui/styles": { - "version": "4.11.5", - "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.5.tgz", - "integrity": "sha512-o/41ot5JJiUsIETME9wVLAJrmIWL3j0R0Bj2kCOLbSfqEkKf0fmaPt+5vtblUh5eXr2S+J/8J3DaCb10+CzPGA==", + "@mui/styled-engine": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.6.1.tgz", + "integrity": "sha512-jEhH6TBY8jc9S8yVncXmoTYTbATjEu44RMFXj6sIYfKr5NArVwTwRo3JexLL0t3BOAiYM4xsFLgfKEIvB9SAeQ==", "requires": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.7.2" + } + }, + "@mui/styles": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-5.6.1.tgz", + "integrity": "sha512-4BrlZIKG5vp5gKpiyKvcSGka/VBUyEI/59WnCxPU2RxNT0WLkoGlRKTU5NO+e+Ng8h7sLR9BF6yglDhMhtUJ0Q==", + "requires": { + "@babel/runtime": "^7.17.2", "@emotion/hash": "^0.8.0", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "clsx": "^1.0.4", - "csstype": "^2.5.2", + "@mui/private-theming": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "jss": "^10.5.1", - "jss-plugin-camel-case": "^10.5.1", - "jss-plugin-default-unit": "^10.5.1", - "jss-plugin-global": "^10.5.1", - "jss-plugin-nested": "^10.5.1", - "jss-plugin-props-sort": "^10.5.1", - "jss-plugin-rule-value-function": "^10.5.1", - "jss-plugin-vendor-prefixer": "^10.5.1", + "jss": "^10.8.2", + "jss-plugin-camel-case": "^10.8.2", + "jss-plugin-default-unit": "^10.8.2", + "jss-plugin-global": "^10.8.2", + "jss-plugin-nested": "^10.8.2", + "jss-plugin-props-sort": "^10.8.2", + "jss-plugin-rule-value-function": "^10.8.2", + "jss-plugin-vendor-prefixer": "^10.8.2", "prop-types": "^15.7.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } } }, - "@material-ui/system": { - "version": "4.12.2", - "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.2.tgz", - "integrity": "sha512-6CSKu2MtmiJgcCGf6nBQpM8fLkuB9F55EKfbdTC80NND5wpTmKzwdhLYLH3zL4cLlK0gVaaltW7/wMuyTnN0Lw==", + "@mui/system": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.6.1.tgz", + "integrity": "sha512-Y5pDvEOK6VOY+0vgNeyDuEEO5QCinhXbZQDyLOlaGLKuAoRGLXO9pcSsjZoGkewYZitXD44EDfgBQ+BqsAfgUA==", "requires": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.3", - "csstype": "^2.5.2", + "@babel/runtime": "^7.17.2", + "@mui/private-theming": "^5.6.1", + "@mui/styled-engine": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "prop-types": "^15.7.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } } }, - "@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "@mui/types": { + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.3.tgz", + "integrity": "sha512-DDF0UhMBo4Uezlk+6QxrlDbchF79XG6Zs0zIewlR4c0Dt6GKVFfUtzPtHCH1tTbcSlq/L2bGEdiaoHBJ9Y1gSA==", "requires": {} }, - "@material-ui/utils": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz", - "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==", + "@mui/utils": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.6.1.tgz", + "integrity": "sha512-CPrzrkiBusCZBLWu0Sg5MJvR3fKJyK3gKecLVX012LULyqg2U64Oz04BKhfkbtBrPBbSQxM+DWW9B1c9hmV9nQ==", "requires": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@types/prop-types": "^15.7.4", + "@types/react-is": "^16.7.1 || ^17.0.0", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2" } }, "@nodelib/fs.scandir": { @@ -21190,6 +21661,11 @@ } } }, + "@popperjs/core": { + "version": "2.11.5", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", + "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==" + }, "@rollup/plugin-babel": { "version": "5.3.1", "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz", @@ -21879,6 +22355,14 @@ "@types/react": "^17" } }, + "@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "requires": { + "@types/react": "*" + } + }, "@types/react-modal": { "version": "3.13.1", "resolved": "https://registry.npmjs.org/@types/react-modal/-/react-modal-3.13.1.tgz", @@ -23844,11 +24328,6 @@ } } }, - "csstype": { - "version": "2.6.20", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.20.tgz", - "integrity": "sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==" - }, "damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -25216,6 +25695,11 @@ "pkg-dir": "^4.1.0" } }, + "find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -28849,11 +29333,6 @@ } } }, - "popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" - }, "portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -31096,6 +31575,11 @@ "postcss-selector-parser": "^6.0.4" } }, + "stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", diff --git a/javascript/grid-ui/package.json b/javascript/grid-ui/package.json index dce062a917e8a..5e54b6e03fff3 100644 --- a/javascript/grid-ui/package.json +++ b/javascript/grid-ui/package.json @@ -5,8 +5,11 @@ "type": "module", "dependencies": { "@apollo/client": "^3.5.10", - "@material-ui/core": "^4.11.4", - "@material-ui/icons": "^4.11.2", + "@emotion/react": "^11.9.0", + "@emotion/styled": "^11.8.1", + "@mui/icons-material": "^5.6.1", + "@mui/material": "^5.6.1", + "@mui/styles": "^5.6.1", "@novnc/novnc": "^1.2.0", "@types/react": "^17.0.43", "@types/react-dom": "^17.0.14", diff --git a/javascript/grid-ui/src/App.tsx b/javascript/grid-ui/src/App.tsx index 74d23e496e0ce..9d07f85237dd6 100644 --- a/javascript/grid-ui/src/App.tsx +++ b/javascript/grid-ui/src/App.tsx @@ -28,15 +28,13 @@ import { GridConfig } from './config' import TopBar from './components/TopBar/TopBar' import Overview from './screens/Overview/Overview' import Footer from './components/Footer/Footer' -import Container from '@material-ui/core/Container' +import Container from '@mui/material/Container' import Sessions from './screens/Sessions/Sessions' import Help from './screens/Help/Help' -import { - createStyles, - StyleRules, - Theme, - withStyles -} from '@material-ui/core/styles' +import { Theme } from '@mui/material/styles' +import { StyleRules } from '@mui/styles' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' import { loader } from 'graphql.macro' import NavBar from './components/NavBar/NavBar' diff --git a/javascript/grid-ui/src/components/EnhancedTableToolbar.tsx b/javascript/grid-ui/src/components/EnhancedTableToolbar.tsx index a3d8ba244415e..30a8feb4c8898 100644 --- a/javascript/grid-ui/src/components/EnhancedTableToolbar.tsx +++ b/javascript/grid-ui/src/components/EnhancedTableToolbar.tsx @@ -16,9 +16,11 @@ // under the License. import React, { ReactNode } from 'react' -import { StyleRules, Theme, withStyles } from '@material-ui/core/styles' -import Toolbar from '@material-ui/core/Toolbar' -import Typography from '@material-ui/core/Typography' +import { Theme } from '@mui/material/styles' +import { StyleRules } from '@mui/styles' +import withStyles from '@mui/styles/withStyles' +import Toolbar from '@mui/material/Toolbar' +import Typography from '@mui/material/Typography' const useStyles = (theme: Theme): StyleRules => ( { diff --git a/javascript/grid-ui/src/components/Error/Error.tsx b/javascript/grid-ui/src/components/Error/Error.tsx index a056f083525a8..1b5c8bdcad241 100644 --- a/javascript/grid-ui/src/components/Error/Error.tsx +++ b/javascript/grid-ui/src/components/Error/Error.tsx @@ -16,8 +16,10 @@ // under the License. import React, { ReactNode } from 'react' -import { Box, Container, createStyles, Typography, Theme, withStyles } from '@material-ui/core' -import { StyleRules } from '@material-ui/core/styles' +import { Box, Container, Typography, Theme } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' +import { StyleRules } from '@mui/styles' const useStyles = (theme: Theme): StyleRules => createStyles( { diff --git a/javascript/grid-ui/src/components/Footer/Footer.tsx b/javascript/grid-ui/src/components/Footer/Footer.tsx index e2cd11291828c..ddefad3ca2e59 100644 --- a/javascript/grid-ui/src/components/Footer/Footer.tsx +++ b/javascript/grid-ui/src/components/Footer/Footer.tsx @@ -16,7 +16,7 @@ // under the License. import React, { ReactNode } from 'react' -import { Box, Link, Typography } from '@material-ui/core' +import { Box, Link, Typography } from '@mui/material' class Footer extends React.Component<{}, {}> { render (): ReactNode { @@ -24,11 +24,16 @@ class Footer extends React.Component<{}, {}> { return ( - + Help {' - All rights reserved - '} - + Software Freedom Conservancy {' '} {new Date().getFullYear()}. diff --git a/javascript/grid-ui/src/components/LiveView/LiveView.tsx b/javascript/grid-ui/src/components/LiveView/LiveView.tsx index aa31f761bed37..9de54648ec5fa 100644 --- a/javascript/grid-ui/src/components/LiveView/LiveView.tsx +++ b/javascript/grid-ui/src/components/LiveView/LiveView.tsx @@ -16,8 +16,10 @@ // under the License. import React, { ReactNode } from 'react' -import { createStyles, Theme, withStyles } from '@material-ui/core' -import { StyleRules } from '@material-ui/core/styles' +import { Theme } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' +import { StyleRules } from '@mui/styles' import RFB from '@novnc/novnc/core/rfb' import PasswordDialog from './PasswordDialog' diff --git a/javascript/grid-ui/src/components/LiveView/PasswordDialog.tsx b/javascript/grid-ui/src/components/LiveView/PasswordDialog.tsx index 45468a8b87fd3..320455c42a861 100644 --- a/javascript/grid-ui/src/components/LiveView/PasswordDialog.tsx +++ b/javascript/grid-ui/src/components/LiveView/PasswordDialog.tsx @@ -26,13 +26,14 @@ import { FormControl, Input, InputAdornment, - InputLabel, - makeStyles -} from '@material-ui/core' + InputLabel +} from '@mui/material' +import makeStyles from '@mui/styles/makeStyles' import clsx from 'clsx' -import { createStyles, Theme } from '@material-ui/core/styles' -import IconButton from '@material-ui/core/IconButton' -import { Visibility, VisibilityOff } from '@material-ui/icons' +import { Theme } from '@mui/material/styles' +import createStyles from '@mui/styles/createStyles' +import IconButton from '@mui/material/IconButton' +import { Visibility, VisibilityOff } from '@mui/icons-material' const useStyles = makeStyles((theme: Theme) => createStyles({ @@ -91,7 +92,10 @@ const PasswordDialog = (props) => { {children} - + @@ -111,6 +115,7 @@ const PasswordDialog = (props) => { aria-label='toggle password visibility' onClick={handleClickShowPassword} onMouseDown={handleMouseDownPassword} + size='large' > {values.showPassword ? : } diff --git a/javascript/grid-ui/src/components/Loading/Loading.tsx b/javascript/grid-ui/src/components/Loading/Loading.tsx index fdcb3f1521180..34e8ad74657be 100644 --- a/javascript/grid-ui/src/components/Loading/Loading.tsx +++ b/javascript/grid-ui/src/components/Loading/Loading.tsx @@ -16,15 +16,11 @@ // under the License. import React, { ReactNode } from 'react' -import LinearProgress from '@material-ui/core/LinearProgress' -import { - Box, - createStyles, - Theme, - Typography, - withStyles -} from '@material-ui/core' -import { StyleRules } from '@material-ui/core/styles' +import LinearProgress from '@mui/material/LinearProgress' +import { Box, Theme, Typography } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' +import { StyleRules } from '@mui/styles' const useStyles = (theme: Theme): StyleRules => createStyles( { diff --git a/javascript/grid-ui/src/components/NavBar/NavBar.tsx b/javascript/grid-ui/src/components/NavBar/NavBar.tsx index 20461b070d8b5..9f0ce58028902 100644 --- a/javascript/grid-ui/src/components/NavBar/NavBar.tsx +++ b/javascript/grid-ui/src/components/NavBar/NavBar.tsx @@ -15,29 +15,25 @@ // specific language governing permissions and limitations // under the License. -import Divider from '@material-ui/core/Divider' -import Drawer from '@material-ui/core/Drawer' -import IconButton from '@material-ui/core/IconButton' -import List from '@material-ui/core/List' -import ListItem from '@material-ui/core/ListItem' -import ListItemIcon from '@material-ui/core/ListItemIcon' -import ListItemText from '@material-ui/core/ListItemText' -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft' -import DashboardIcon from '@material-ui/icons/Dashboard' -import AssessmentIcon from '@material-ui/icons/Assessment' -import HelpIcon from '@material-ui/icons/Help' +import Divider from '@mui/material/Divider' +import Drawer from '@mui/material/Drawer' +import IconButton from '@mui/material/IconButton' +import List from '@mui/material/List' +import ListItem from '@mui/material/ListItem' +import ListItemIcon from '@mui/material/ListItemIcon' +import ListItemText from '@mui/material/ListItemText' +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft' +import DashboardIcon from '@mui/icons-material/Dashboard' +import AssessmentIcon from '@mui/icons-material/Assessment' +import HelpIcon from '@mui/icons-material/Help' import clsx from 'clsx' import React, { ReactNode } from 'react' -import { - Box, - createStyles, - Theme, - Typography, - withStyles -} from '@material-ui/core' +import { Box, Theme, Typography } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' import { useLocation } from 'react-router-dom' import OverallConcurrency from './OverallConcurrency' -import { StyleRules } from '@material-ui/core/styles' +import { StyleRules } from '@mui/styles' const drawerWidth = 240 @@ -157,7 +153,7 @@ class NavBar extends React.Component { open={open} >
- +
diff --git a/javascript/grid-ui/src/components/NavBar/OverallConcurrency.tsx b/javascript/grid-ui/src/components/NavBar/OverallConcurrency.tsx index 580d9f87eb9e5..91458f536b8a0 100644 --- a/javascript/grid-ui/src/components/NavBar/OverallConcurrency.tsx +++ b/javascript/grid-ui/src/components/NavBar/OverallConcurrency.tsx @@ -16,16 +16,10 @@ // under the License. import React, { ReactNode } from 'react' -import { - Box, - CircularProgress, - CircularProgressProps, - createStyles, - Theme, - Typography, - withStyles -} from '@material-ui/core' -import { StyleRules } from '@material-ui/core/styles' +import { Box, CircularProgress, CircularProgressProps, Theme, Typography } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' +import { StyleRules } from '@mui/styles' const useStyles = (theme: Theme): StyleRules => createStyles( { diff --git a/javascript/grid-ui/src/components/NoData/NoData.tsx b/javascript/grid-ui/src/components/NoData/NoData.tsx index 0823501fea26b..2c33bda733dc5 100644 --- a/javascript/grid-ui/src/components/NoData/NoData.tsx +++ b/javascript/grid-ui/src/components/NoData/NoData.tsx @@ -16,16 +16,10 @@ // under the License. import React, { ReactNode } from 'react' -import { - Box, - Container, - createStyles, - Link, - Theme, - Typography, - withStyles -} from '@material-ui/core' -import { StyleRules } from '@material-ui/core/styles' +import { Box, Container, Link, Theme, Typography } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' +import { StyleRules } from '@mui/styles' const useStyles = (theme: Theme): StyleRules => createStyles({ root: { @@ -69,7 +63,7 @@ class NoData extends React.Component { variant='h4' > More information about Selenium Grid can be found at the{' '} - + Help {' '}section. diff --git a/javascript/grid-ui/src/components/Node/Node.tsx b/javascript/grid-ui/src/components/Node/Node.tsx index 228d4d7902bbd..5be8bb30bd4da 100644 --- a/javascript/grid-ui/src/components/Node/Node.tsx +++ b/javascript/grid-ui/src/components/Node/Node.tsx @@ -15,16 +15,9 @@ // specific language governing permissions and limitations // under the License. -import { - Box, - Card, - CardContent, - createStyles, - Grid, - Theme, - Typography, - withStyles -} from '@material-ui/core' +import { Box, Card, CardContent, Grid, Theme, Typography } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' import React, { ReactNode } from 'react' import NodeInfo from '../../models/node-info' import NodeDetailsDialog from './NodeDetailsDialog' @@ -32,7 +25,7 @@ import NodeLoad from './NodeLoad' import Stereotypes from './Stereotypes' import clsx from 'clsx' import OsLogo from '../common/OsLogo' -import { StyleRules } from '@material-ui/core/styles' +import { StyleRules } from '@mui/styles' const useStyles = (theme: Theme): StyleRules => createStyles( { diff --git a/javascript/grid-ui/src/components/Node/NodeDetailsDialog.tsx b/javascript/grid-ui/src/components/Node/NodeDetailsDialog.tsx index 925d49c863511..8189861d2214c 100644 --- a/javascript/grid-ui/src/components/Node/NodeDetailsDialog.tsx +++ b/javascript/grid-ui/src/components/Node/NodeDetailsDialog.tsx @@ -18,20 +18,20 @@ import { Box, Button, - createStyles, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, - Typography, - withStyles -} from '@material-ui/core' + Typography +} from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' import React, { ReactNode } from 'react' import NodeInfo from '../../models/node-info' -import InfoIcon from '@material-ui/icons/Info' +import InfoIcon from '@mui/icons-material/Info' import OsLogo from '../common/OsLogo' -import { StyleRules } from '@material-ui/core/styles' +import { StyleRules } from '@mui/styles' const useStyles = (): StyleRules => createStyles( { @@ -76,6 +76,7 @@ class NodeDetailsDialog extends React.Component diff --git a/javascript/grid-ui/src/components/Node/NodeLoad.tsx b/javascript/grid-ui/src/components/Node/NodeLoad.tsx index 3d9dfafa62f25..de381f24b2cfc 100644 --- a/javascript/grid-ui/src/components/Node/NodeLoad.tsx +++ b/javascript/grid-ui/src/components/Node/NodeLoad.tsx @@ -15,10 +15,10 @@ // specific language governing permissions and limitations // under the License. -import { Box, Grid, Typography } from '@material-ui/core' +import { Box, Grid, Typography } from '@mui/material' import React, { ReactNode } from 'react' import NodeInfo from '../../models/node-info' -import LinearProgress, { LinearProgressProps } from '@material-ui/core/LinearProgress' +import LinearProgress, { LinearProgressProps } from '@mui/material/LinearProgress' function LinearProgressWithLabel (props: LinearProgressProps & { value: number }): JSX.Element { return ( diff --git a/javascript/grid-ui/src/components/Node/Stereotypes.tsx b/javascript/grid-ui/src/components/Node/Stereotypes.tsx index dfd8637576d4f..e799a0bff429d 100644 --- a/javascript/grid-ui/src/components/Node/Stereotypes.tsx +++ b/javascript/grid-ui/src/components/Node/Stereotypes.tsx @@ -15,19 +15,13 @@ // specific language governing permissions and limitations // under the License. -import { - Badge, - Box, - createStyles, - Grid, - Tooltip, - Typography, - withStyles -} from '@material-ui/core' +import { Badge, Box, Grid, Tooltip, Typography } from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' import React, { ReactNode } from 'react' import StereotypeInfo from '../../models/stereotype-info' import BrowserLogo from '../common/BrowserLogo' -import { StyleRules } from '@material-ui/core/styles' +import { StyleRules } from '@mui/styles' import OsLogo from '../common/OsLogo' import { Size } from '../../models/size' diff --git a/javascript/grid-ui/src/components/QueuedSessions/QueuedSessions.tsx b/javascript/grid-ui/src/components/QueuedSessions/QueuedSessions.tsx index 2959801e320ce..b1c59ada2d0b4 100644 --- a/javascript/grid-ui/src/components/QueuedSessions/QueuedSessions.tsx +++ b/javascript/grid-ui/src/components/QueuedSessions/QueuedSessions.tsx @@ -16,8 +16,11 @@ // under the License. import * as React from 'react' -import { createStyles, StyleRules, Theme } from '@material-ui/core/styles' -import { List, ListItem, withStyles } from '@material-ui/core' +import { Theme } from '@mui/material/styles' +import { StyleRules } from '@mui/styles' +import createStyles from '@mui/styles/createStyles' +import { List, ListItem } from '@mui/material' +import withStyles from '@mui/styles/withStyles' import EnhancedTableToolbar from '../EnhancedTableToolbar' import { ReactNode } from 'react' diff --git a/javascript/grid-ui/src/components/RunningSessions/RunningSessions.tsx b/javascript/grid-ui/src/components/RunningSessions/RunningSessions.tsx index 745bc51dfb2c7..01e5917c3c978 100644 --- a/javascript/grid-ui/src/components/RunningSessions/RunningSessions.tsx +++ b/javascript/grid-ui/src/components/RunningSessions/RunningSessions.tsx @@ -16,35 +16,35 @@ // under the License. import React, { ReactNode } from 'react' -import Table from '@material-ui/core/Table' -import TableBody from '@material-ui/core/TableBody' -import TableCell from '@material-ui/core/TableCell' -import TableContainer from '@material-ui/core/TableContainer' -import TableHead from '@material-ui/core/TableHead' -import TablePagination from '@material-ui/core/TablePagination' -import TableRow from '@material-ui/core/TableRow' -import TableSortLabel from '@material-ui/core/TableSortLabel' -import Typography from '@material-ui/core/Typography' -import Paper from '@material-ui/core/Paper' -import FormControlLabel from '@material-ui/core/FormControlLabel' -import Switch from '@material-ui/core/Switch' +import Table from '@mui/material/Table' +import TableBody from '@mui/material/TableBody' +import TableCell from '@mui/material/TableCell' +import TableContainer from '@mui/material/TableContainer' +import TableHead from '@mui/material/TableHead' +import TablePagination from '@mui/material/TablePagination' +import TableRow from '@mui/material/TableRow' +import TableSortLabel from '@mui/material/TableSortLabel' +import Typography from '@mui/material/Typography' +import Paper from '@mui/material/Paper' +import FormControlLabel from '@mui/material/FormControlLabel' +import Switch from '@mui/material/Switch' import { Box, Button, - createStyles, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, - Theme, - withStyles -} from '@material-ui/core' -import InfoIcon from '@material-ui/icons/Info' -import VideocamIcon from '@material-ui/icons/Videocam' -import Slide from '@material-ui/core/Slide' -import { StyleRules } from '@material-ui/core/styles' -import { TransitionProps } from '@material-ui/core/transitions' + Theme +} from '@mui/material' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' +import InfoIcon from '@mui/icons-material/Info' +import VideocamIcon from '@mui/icons-material/Videocam' +import Slide from '@mui/material/Slide' +import { StyleRules } from '@mui/styles' +import { TransitionProps } from '@mui/material/transitions' import browserVersion from '../../util/browser-version' import EnhancedTableToolbar from '../EnhancedTableToolbar' import prettyMilliseconds from 'pretty-ms' @@ -272,7 +272,7 @@ interface RunningSessionsState { } const Transition = React.forwardRef(function Transition ( - props: TransitionProps & { children?: React.ReactElement }, + props: TransitionProps & { children: React.ReactElement }, ref: React.Ref ) { return @@ -359,6 +359,7 @@ class RunningSessions extends React.Component @@ -374,6 +375,7 @@ class RunningSessions extends React.Component diff --git a/javascript/grid-ui/src/components/TopBar/TopBar.tsx b/javascript/grid-ui/src/components/TopBar/TopBar.tsx index 411788534e504..14cafe15c8123 100644 --- a/javascript/grid-ui/src/components/TopBar/TopBar.tsx +++ b/javascript/grid-ui/src/components/TopBar/TopBar.tsx @@ -1,17 +1,19 @@ -import AppBar from '@material-ui/core/AppBar' -import Box from '@material-ui/core/Box' -import CssBaseline from '@material-ui/core/CssBaseline' -import IconButton from '@material-ui/core/IconButton' -import { createStyles, StyleRules, Theme } from '@material-ui/core/styles' -import Toolbar from '@material-ui/core/Toolbar' -import Typography from '@material-ui/core/Typography' -import ChevronLeftIcon from '@material-ui/icons/ChevronLeft' -import MenuIcon from '@material-ui/icons/Menu' -import HelpIcon from '@material-ui/icons/Help' +import AppBar from '@mui/material/AppBar' +import Box from '@mui/material/Box' +import CssBaseline from '@mui/material/CssBaseline' +import IconButton from '@mui/material/IconButton' +import { Theme } from '@mui/material/styles' +import { StyleRules } from '@mui/styles' +import createStyles from '@mui/styles/createStyles' +import Toolbar from '@mui/material/Toolbar' +import Typography from '@mui/material/Typography' +import ChevronLeftIcon from '@mui/icons-material/ChevronLeft' +import MenuIcon from '@mui/icons-material/Menu' +import HelpIcon from '@mui/icons-material/Help' import clsx from 'clsx' import React, { ReactNode } from 'react' import seleniumGridLogo from '../../assets/selenium-grid-logo.svg' -import { withStyles } from '@material-ui/core' +import withStyles from '@mui/styles/withStyles' import { ApolloClient } from '@apollo/client' const useStyles = (theme: Theme): StyleRules => createStyles( @@ -89,6 +91,7 @@ class TopBar extends React.Component { aria-label={drawerOpen ? 'close drawer' : 'open drawer'} onClick={toggleDrawer} className={classes.menuButton} + size='large' > {drawerOpen ? () : ()} @@ -100,6 +103,7 @@ class TopBar extends React.Component { href='#help' className={clsx(classes.menuButton, !error && classes.menuButtonHidden)} + size='large' > diff --git a/javascript/grid-ui/src/components/common/BrowserLogo.tsx b/javascript/grid-ui/src/components/common/BrowserLogo.tsx index 19dd29d767fad..6b200a5755eca 100644 --- a/javascript/grid-ui/src/components/common/BrowserLogo.tsx +++ b/javascript/grid-ui/src/components/common/BrowserLogo.tsx @@ -16,7 +16,8 @@ // under the License. import React, { ReactNode } from 'react' -import { StyleRules, withStyles } from '@material-ui/core/styles' +import { StyleRules } from '@mui/styles' +import withStyles from '@mui/styles/withStyles' import browserLogo from '../../util/browser-logo' import { Size } from '../../models/size' import clsx from 'clsx' diff --git a/javascript/grid-ui/src/components/common/OsLogo.tsx b/javascript/grid-ui/src/components/common/OsLogo.tsx index 1b14a2266dac8..e82496fb86f91 100644 --- a/javascript/grid-ui/src/components/common/OsLogo.tsx +++ b/javascript/grid-ui/src/components/common/OsLogo.tsx @@ -16,7 +16,8 @@ // under the License. import React, { ReactNode } from 'react' -import { StyleRules, withStyles } from '@material-ui/core/styles' +import { StyleRules } from '@mui/styles' +import withStyles from '@mui/styles/withStyles' import { Size } from '../../models/size' import osLogo from '../../util/os-logo' import clsx from 'clsx' diff --git a/javascript/grid-ui/src/index.tsx b/javascript/grid-ui/src/index.tsx index 2788adfc7b837..cacd31ac3fc1e 100644 --- a/javascript/grid-ui/src/index.tsx +++ b/javascript/grid-ui/src/index.tsx @@ -1,5 +1,9 @@ -import { CssBaseline } from '@material-ui/core' -import { ThemeProvider } from '@material-ui/core/styles' +import { CssBaseline } from '@mui/material' +import { + StyledEngineProvider, + Theme, + ThemeProvider +} from '@mui/material/styles' import React from 'react' import ReactDOM from 'react-dom' import { HashRouter as Router } from 'react-router-dom' @@ -8,15 +12,21 @@ import * as serviceWorker from './serviceWorker' import theme from './theme/theme' import './index.css' +declare module '@mui/styles/defaultTheme' { + interface DefaultTheme extends Theme {} +} + ReactDOM.render( - - {/* CssBaseline kick start an elegant, consistent, and simple baseline to build upon. */} - - - - - + + + {/* CssBaseline kick-start an elegant, consistent, and simple baseline to build upon. */} + + + + + + , document.getElementById('root') ) diff --git a/javascript/grid-ui/src/screens/Help/Help.tsx b/javascript/grid-ui/src/screens/Help/Help.tsx index d3457e9b31e0d..a10dd3df0f538 100644 --- a/javascript/grid-ui/src/screens/Help/Help.tsx +++ b/javascript/grid-ui/src/screens/Help/Help.tsx @@ -16,13 +16,11 @@ // under the License. import React, { ReactNode } from 'react' -import { Box, Container, Link, Typography } from '@material-ui/core' -import { - createStyles, - StyleRules, - Theme, - withStyles -} from '@material-ui/core/styles' +import { Box, Container, Link, Typography } from '@mui/material' +import { Theme } from '@mui/material/styles' +import { StyleRules } from '@mui/styles' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' import { useLocation } from 'react-router-dom' const useStyles = (theme: Theme): StyleRules => createStyles( @@ -67,7 +65,9 @@ function HelpContainer (): JSX.Element { More information about Selenium Grid can be found at the{' '} documentation . @@ -82,7 +82,9 @@ function HelpContainer (): JSX.Element { Please report bugs and issues to the Selenium{' '} issue tracker . @@ -98,7 +100,9 @@ function HelpContainer (): JSX.Element { our{' '} website . @@ -114,14 +118,18 @@ function HelpContainer (): JSX.Element { community, contributions from these{' '} people , and our{' '} sponsors . diff --git a/javascript/grid-ui/src/screens/Overview/Overview.tsx b/javascript/grid-ui/src/screens/Overview/Overview.tsx index b1738a114431b..5239f2473ed23 100644 --- a/javascript/grid-ui/src/screens/Overview/Overview.tsx +++ b/javascript/grid-ui/src/screens/Overview/Overview.tsx @@ -15,14 +15,12 @@ // specific language governing permissions and limitations // under the License. -import Grid from '@material-ui/core/Grid' -import Paper from '@material-ui/core/Paper' -import { - createStyles, - StyleRules, - Theme, - withStyles -} from '@material-ui/core/styles' +import Grid from '@mui/material/Grid' +import Paper from '@mui/material/Paper' +import { Theme } from '@mui/material/styles' +import { StyleRules } from '@mui/styles' +import createStyles from '@mui/styles/createStyles' +import withStyles from '@mui/styles/withStyles' import clsx from 'clsx' import { loader } from 'graphql.macro' import React, { ReactNode } from 'react' diff --git a/javascript/grid-ui/src/screens/Sessions/Sessions.tsx b/javascript/grid-ui/src/screens/Sessions/Sessions.tsx index c03df91db3715..f58c819201a01 100644 --- a/javascript/grid-ui/src/screens/Sessions/Sessions.tsx +++ b/javascript/grid-ui/src/screens/Sessions/Sessions.tsx @@ -20,7 +20,7 @@ import RunningSessions from '../../components/RunningSessions/RunningSessions' import { ApolloClient, ApolloConsumer } from '@apollo/client' import { loader } from 'graphql.macro' import { GridConfig } from '../../config' -import Grid from '@material-ui/core/Grid' +import Grid from '@mui/material/Grid' import QueuedSessions from '../../components/QueuedSessions/QueuedSessions' import NoData from '../../components/NoData/NoData' import Loading from '../../components/Loading/Loading' diff --git a/javascript/grid-ui/src/theme/theme.tsx b/javascript/grid-ui/src/theme/theme.tsx index f5d1036e88fae..758cc9184a72d 100644 --- a/javascript/grid-ui/src/theme/theme.tsx +++ b/javascript/grid-ui/src/theme/theme.tsx @@ -1,26 +1,9 @@ -// Licensed to the Software Freedom Conservancy (SFC) under one -// or more contributor license agreements. See the NOTICE file -// distributed with this work for additional information -// regarding copyright ownership. The SFC licenses this file -// to you under the Apache License, Version 2.0 (the -// "License"); you may not use this file except in compliance -// with the License. You may obtain a copy of the License at -// -// http://www.apache.org/licenses/LICENSE-2.0 -// -// Unless required by applicable law or agreed to in writing, -// software distributed under the License is distributed on an -// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY -// KIND, either express or implied. See the License for the -// specific language governing permissions and limitations -// under the License. - -import red from '@material-ui/core/colors/red' -import { createMuiTheme, Theme } from '@material-ui/core/styles' +import { createTheme, Theme, adaptV4Theme } from '@mui/material/styles' import typography from './typography' +import { red } from '@mui/material/colors' // A custom theme for this app -const theme: Theme = createMuiTheme({ +const theme: Theme = createTheme(adaptV4Theme({ palette: { primary: { main: '#615E9B' @@ -36,6 +19,6 @@ const theme: Theme = createMuiTheme({ } }, typography -}) +})) export default theme diff --git a/package-lock.json b/package-lock.json index 897bd115cc3d1..b802acd3509f9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6,8 +6,11 @@ "": { "dependencies": { "@apollo/client": "^3.5.10", - "@material-ui/core": "^4.11.4", - "@material-ui/icons": "^4.11.2", + "@emotion/react": "^11.9.0", + "@emotion/styled": "^11.8.1", + "@mui/icons-material": "^5.6.1", + "@mui/material": "^5.6.1", + "@mui/styles": "^5.6.1", "@novnc/novnc": "^1.2.0", "@types/react": "^17.0.43", "@types/react-dom": "^17.0.14", @@ -388,7 +391,6 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz", "integrity": "sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==", - "dev": true, "engines": { "node": ">=6.9.0" } @@ -958,7 +960,6 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.16.7.tgz", "integrity": "sha512-Esxmk7YjA8QysKeT3VhTXvF6y77f/a91SIs4pWb4H2eWGQkCKFgQaG6hdoEVZtGsrAcb2K5BW66XsOErD4WU3Q==", - "dev": true, "dependencies": { "@babel/helper-plugin-utils": "^7.16.7" }, @@ -2171,11 +2172,157 @@ "postcss": "^8.3" } }, + "node_modules/@emotion/babel-plugin": { + "version": "11.9.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz", + "integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==", + "dependencies": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "peerDependencies": { + "@babel/core": "^7.0.0" + } + }, + "node_modules/@emotion/babel-plugin/node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "dependencies": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, "node_modules/@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" }, + "node_modules/@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "dependencies": { + "@emotion/memoize": "^0.7.4" + } + }, + "node_modules/@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "node_modules/@emotion/react": { + "version": "11.9.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.0.tgz", + "integrity": "sha512-lBVSF5d0ceKtfKCDQJveNAtkC7ayxpVlgOohLgXqRwqWr9bOf4TZAFFyIcNngnV6xK6X4x2ZeXq7vliHkoVkxQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.3", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/serialize": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.3.tgz", + "integrity": "sha512-2mSSvgLfyV3q+iVh3YWgNlUc2a9ZlDU7DjuP5MjK3AXRR0dYigCrP99aeFtaB2L/hjfEZdSThn5dsZ0ufqbvsA==", + "dependencies": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + } + }, + "node_modules/@emotion/serialize/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "node_modules/@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "dependencies": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + }, + "peerDependencies": { + "@babel/core": "^7.0.0", + "@emotion/react": "^11.0.0-rc.0", + "react": ">=16.8.0" + }, + "peerDependenciesMeta": { + "@babel/core": { + "optional": true + }, + "@types/react": { + "optional": true + } + } + }, + "node_modules/@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "node_modules/@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "node_modules/@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "node_modules/@eslint/eslintrc": { "version": "0.4.3", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.4.3.tgz", @@ -3017,57 +3164,131 @@ "integrity": "sha512-nkalE/f1RvRGChwBnEIoBfSEYOXnCRdleKuv6+lePbMDrMZXeDQnqak5XDOeBgrPPyPfAdcCu/B5z+v3VhplGg==", "dev": true }, - "node_modules/@material-ui/core": { - "version": "4.12.4", - "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.12.4.tgz", - "integrity": "sha512-tr7xekNlM9LjA6pagJmL8QCgZXaubWUwkJnoYcMKd4gw/t4XiyvnTkjdGrUVicyB2BsdaAv1tvow45bPM4sSwQ==", + "node_modules/@mui/base": { + "version": "5.0.0-alpha.76", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.76.tgz", + "integrity": "sha512-Pd0l4DvjXiGRyipn/CTDlYB2XrJwhpLktVXvbvcmzL2SMDaNprSarZqBkPHIubkulmRDZEEcnFDrpKgeSJDg4A==", + "dependencies": { + "@babel/runtime": "^7.17.2", + "@emotion/is-prop-valid": "^1.1.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@popperjs/core": "^2.11.5", + "clsx": "^1.1.1", + "prop-types": "^15.7.2", + "react-is": "^17.0.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/icons-material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.6.1.tgz", + "integrity": "sha512-I1x8u+FRLOmoJpRJASMx9UG+jZrSkNLyRQmBXivQQwXu3m3iasMoaKYhhI0J18t8+FWktbkNTp63oEUHE9Gw0Q==", + "dependencies": { + "@babel/runtime": "^7.17.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@mui/material": "^5.0.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.6.1.tgz", + "integrity": "sha512-xg6pPq+1jxWupwmPpnfmsHNjrsOe2xynUQWrRfcH8WHrrr1sQulq0VF4gORq/l8DD8a/jb4s8SsC20e/e6mHKQ==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/styles": "^4.11.5", - "@material-ui/system": "^4.12.2", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "@types/react-transition-group": "^4.2.0", - "clsx": "^1.0.4", + "@babel/runtime": "^7.17.2", + "@mui/base": "5.0.0-alpha.76", + "@mui/system": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "popper.js": "1.16.1-lts", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0", - "react-transition-group": "^4.4.0" + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, "@types/react": { "optional": true } } }, - "node_modules/@material-ui/icons": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.3.tgz", - "integrity": "sha512-IKHlyx6LDh8n19vzwH5RtHIOHl9Tu90aAAxcbWME6kp4dmvODM3UvOHJeMIDzUbd4muuJKHmlNoBN+mDY4XkBA==", + "node_modules/@mui/material/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@mui/private-theming": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.6.1.tgz", + "integrity": "sha512-8lgh+tUt/3ftStfvml3dwAzhW3fe/cUFjLcBViOTnWk7UixWR79me4qehsO4NVj0THpu3d2qclrLzdD8qBAWAQ==", "dependencies": { - "@babel/runtime": "^7.4.4" + "@babel/runtime": "^7.17.2", + "@mui/utils": "^5.6.1", + "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@material-ui/core": "^4.0.0", - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -3075,39 +3296,69 @@ } } }, - "node_modules/@material-ui/styles": { - "version": "4.11.5", - "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.5.tgz", - "integrity": "sha512-o/41ot5JJiUsIETME9wVLAJrmIWL3j0R0Bj2kCOLbSfqEkKf0fmaPt+5vtblUh5eXr2S+J/8J3DaCb10+CzPGA==", + "node_modules/@mui/styled-engine": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.6.1.tgz", + "integrity": "sha512-jEhH6TBY8jc9S8yVncXmoTYTbATjEu44RMFXj6sIYfKr5NArVwTwRo3JexLL0t3BOAiYM4xsFLgfKEIvB9SAeQ==", "dependencies": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.7.2" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" + }, + "peerDependencies": { + "@emotion/react": "^11.4.1", + "@emotion/styled": "^11.3.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + } + } + }, + "node_modules/@mui/styles": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-5.6.1.tgz", + "integrity": "sha512-4BrlZIKG5vp5gKpiyKvcSGka/VBUyEI/59WnCxPU2RxNT0WLkoGlRKTU5NO+e+Ng8h7sLR9BF6yglDhMhtUJ0Q==", + "dependencies": { + "@babel/runtime": "^7.17.2", "@emotion/hash": "^0.8.0", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "clsx": "^1.0.4", - "csstype": "^2.5.2", + "@mui/private-theming": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "jss": "^10.5.1", - "jss-plugin-camel-case": "^10.5.1", - "jss-plugin-default-unit": "^10.5.1", - "jss-plugin-global": "^10.5.1", - "jss-plugin-nested": "^10.5.1", - "jss-plugin-props-sort": "^10.5.1", - "jss-plugin-rule-value-function": "^10.5.1", - "jss-plugin-vendor-prefixer": "^10.5.1", + "jss": "^10.8.2", + "jss-plugin-camel-case": "^10.8.2", + "jss-plugin-default-unit": "^10.8.2", + "jss-plugin-global": "^10.8.2", + "jss-plugin-nested": "^10.8.2", + "jss-plugin-props-sort": "^10.8.2", + "jss-plugin-rule-value-function": "^10.8.2", + "jss-plugin-vendor-prefixer": "^10.8.2", "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@types/react": "^17.0.0", + "react": "^17.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -3115,38 +3366,59 @@ } } }, - "node_modules/@material-ui/system": { - "version": "4.12.2", - "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.2.tgz", - "integrity": "sha512-6CSKu2MtmiJgcCGf6nBQpM8fLkuB9F55EKfbdTC80NND5wpTmKzwdhLYLH3zL4cLlK0gVaaltW7/wMuyTnN0Lw==", + "node_modules/@mui/styles/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@mui/system": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.6.1.tgz", + "integrity": "sha512-Y5pDvEOK6VOY+0vgNeyDuEEO5QCinhXbZQDyLOlaGLKuAoRGLXO9pcSsjZoGkewYZitXD44EDfgBQ+BqsAfgUA==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.3", - "csstype": "^2.5.2", + "@babel/runtime": "^7.17.2", + "@mui/private-theming": "^5.6.1", + "@mui/styled-engine": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "prop-types": "^15.7.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, "@types/react": { "optional": true } } }, - "node_modules/@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "node_modules/@mui/system/node_modules/csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + }, + "node_modules/@mui/types": { + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.3.tgz", + "integrity": "sha512-DDF0UhMBo4Uezlk+6QxrlDbchF79XG6Zs0zIewlR4c0Dt6GKVFfUtzPtHCH1tTbcSlq/L2bGEdiaoHBJ9Y1gSA==", "peerDependencies": { "@types/react": "*" }, @@ -3156,21 +3428,26 @@ } } }, - "node_modules/@material-ui/utils": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz", - "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==", + "node_modules/@mui/utils": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.6.1.tgz", + "integrity": "sha512-CPrzrkiBusCZBLWu0Sg5MJvR3fKJyK3gKecLVX012LULyqg2U64Oz04BKhfkbtBrPBbSQxM+DWW9B1c9hmV9nQ==", "dependencies": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@types/prop-types": "^15.7.4", + "@types/react-is": "^16.7.1 || ^17.0.0", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "react": "^17.0.0 || ^18.0.0" } }, "node_modules/@nodelib/fs.scandir": { @@ -3269,6 +3546,15 @@ "node": ">= 8" } }, + "node_modules/@popperjs/core": { + "version": "2.11.5", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", + "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@protobufjs/aspromise": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/@protobufjs/aspromise/-/aspromise-1.1.2.tgz", @@ -4328,6 +4614,14 @@ "@types/react": "^17" } }, + "node_modules/@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "dependencies": { + "@types/react": "*" + } + }, "node_modules/@types/react-modal": { "version": "3.13.1", "resolved": "https://registry.npmjs.org/@types/react-modal/-/react-modal-3.13.1.tgz", @@ -7488,11 +7782,6 @@ "integrity": "sha512-b0tGHbfegbhPJpxpiBPU2sCkigAqtM9O121le6bbOlgyV+NyGyCmVfJ6QW9eRjz8CpNfWEOYBIMIGRYkLwsIYg==", "dev": true }, - "node_modules/csstype": { - "version": "2.6.20", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.20.tgz", - "integrity": "sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==" - }, "node_modules/damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -9832,6 +10121,11 @@ "url": "https://github.com/avajs/find-cache-dir?sponsor=1" } }, + "node_modules/find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -16734,11 +17028,6 @@ "node": ">=4" } }, - "node_modules/popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" - }, "node_modules/portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -22610,6 +22899,11 @@ "postcss": "^8.2.15" } }, + "node_modules/stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "node_modules/supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", @@ -25096,8 +25390,7 @@ "@babel/helper-plugin-utils": { "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.16.7.tgz", - "integrity": "sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==", - "dev": true + "integrity": "sha512-Qg3Nk7ZxpgMrsox6HreY1ZNKdBq7K72tDSliA6dCl5f007jR4ne8iD5UzuNnCJH2xBf2BEEVGr+/OL6Gdp7RxA==" }, "@babel/helper-remap-async-to-generator": { "version": "7.16.8", @@ -25481,7 +25774,6 @@ "version": "7.16.7", "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.16.7.tgz", "integrity": "sha512-Esxmk7YjA8QysKeT3VhTXvF6y77f/a91SIs4pWb4H2eWGQkCKFgQaG6hdoEVZtGsrAcb2K5BW66XsOErD4WU3Q==", - "dev": true, "requires": { "@babel/helper-plugin-utils": "^7.16.7" } @@ -26290,11 +26582,127 @@ "postcss-value-parser": "^4.2.0" } }, + "@emotion/babel-plugin": { + "version": "11.9.2", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.9.2.tgz", + "integrity": "sha512-Pr/7HGH6H6yKgnVFNEj2MVlreu3ADqftqjqwUvDy/OJzKFgxKeTQ+eeUf20FOTuHVkDON2iNa25rAXVYtWJCjw==", + "requires": { + "@babel/helper-module-imports": "^7.12.13", + "@babel/plugin-syntax-jsx": "^7.12.13", + "@babel/runtime": "^7.13.10", + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.5", + "@emotion/serialize": "^1.0.2", + "babel-plugin-macros": "^2.6.1", + "convert-source-map": "^1.5.0", + "escape-string-regexp": "^4.0.0", + "find-root": "^1.1.0", + "source-map": "^0.5.7", + "stylis": "4.0.13" + }, + "dependencies": { + "escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==" + } + } + }, + "@emotion/cache": { + "version": "11.7.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.7.1.tgz", + "integrity": "sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==", + "requires": { + "@emotion/memoize": "^0.7.4", + "@emotion/sheet": "^1.1.0", + "@emotion/utils": "^1.0.0", + "@emotion/weak-memoize": "^0.2.5", + "stylis": "4.0.13" + } + }, "@emotion/hash": { "version": "0.8.0", "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" }, + "@emotion/is-prop-valid": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.1.2.tgz", + "integrity": "sha512-3QnhqeL+WW88YjYbQL5gUIkthuMw7a0NGbZ7wfFVk2kg/CK5w8w5FFa0RzWjyY1+sujN0NWbtSHH6OJmWHtJpQ==", + "requires": { + "@emotion/memoize": "^0.7.4" + } + }, + "@emotion/memoize": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.7.5.tgz", + "integrity": "sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==" + }, + "@emotion/react": { + "version": "11.9.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.9.0.tgz", + "integrity": "sha512-lBVSF5d0ceKtfKCDQJveNAtkC7ayxpVlgOohLgXqRwqWr9bOf4TZAFFyIcNngnV6xK6X4x2ZeXq7vliHkoVkxQ==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/cache": "^11.7.1", + "@emotion/serialize": "^1.0.3", + "@emotion/utils": "^1.1.0", + "@emotion/weak-memoize": "^0.2.5", + "hoist-non-react-statics": "^3.3.1" + } + }, + "@emotion/serialize": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.0.3.tgz", + "integrity": "sha512-2mSSvgLfyV3q+iVh3YWgNlUc2a9ZlDU7DjuP5MjK3AXRR0dYigCrP99aeFtaB2L/hjfEZdSThn5dsZ0ufqbvsA==", + "requires": { + "@emotion/hash": "^0.8.0", + "@emotion/memoize": "^0.7.4", + "@emotion/unitless": "^0.7.5", + "@emotion/utils": "^1.0.0", + "csstype": "^3.0.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } + } + }, + "@emotion/sheet": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.1.0.tgz", + "integrity": "sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==" + }, + "@emotion/styled": { + "version": "11.8.1", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.8.1.tgz", + "integrity": "sha512-OghEVAYBZMpEquHZwuelXcRjRJQOVayvbmNR0zr174NHdmMgrNkLC6TljKC5h9lZLkN5WGrdUcrKlOJ4phhoTQ==", + "requires": { + "@babel/runtime": "^7.13.10", + "@emotion/babel-plugin": "^11.7.1", + "@emotion/is-prop-valid": "^1.1.2", + "@emotion/serialize": "^1.0.2", + "@emotion/utils": "^1.1.0" + } + }, + "@emotion/unitless": { + "version": "0.7.5", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.7.5.tgz", + "integrity": "sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==" + }, + "@emotion/utils": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.1.0.tgz", + "integrity": "sha512-iRLa/Y4Rs5H/f2nimczYmS5kFJEbpiVvgN3XVfZ022IYhuNA1IRSHEizcof88LtCTXtl9S2Cxt32KgaXEu72JQ==" + }, + "@emotion/weak-memoize": { + "version": "0.2.5", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz", + "integrity": "sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==" + }, "@eslint/eslintrc": { "version": "0.4.3", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-0.4.3.tgz", @@ -26950,81 +27358,144 @@ "integrity": "sha512-nkalE/f1RvRGChwBnEIoBfSEYOXnCRdleKuv6+lePbMDrMZXeDQnqak5XDOeBgrPPyPfAdcCu/B5z+v3VhplGg==", "dev": true }, - "@material-ui/core": { - "version": "4.12.4", - "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.12.4.tgz", - "integrity": "sha512-tr7xekNlM9LjA6pagJmL8QCgZXaubWUwkJnoYcMKd4gw/t4XiyvnTkjdGrUVicyB2BsdaAv1tvow45bPM4sSwQ==", + "@mui/base": { + "version": "5.0.0-alpha.76", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-alpha.76.tgz", + "integrity": "sha512-Pd0l4DvjXiGRyipn/CTDlYB2XrJwhpLktVXvbvcmzL2SMDaNprSarZqBkPHIubkulmRDZEEcnFDrpKgeSJDg4A==", + "requires": { + "@babel/runtime": "^7.17.2", + "@emotion/is-prop-valid": "^1.1.2", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@popperjs/core": "^2.11.5", + "clsx": "^1.1.1", + "prop-types": "^15.7.2", + "react-is": "^17.0.2" + } + }, + "@mui/icons-material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.6.1.tgz", + "integrity": "sha512-I1x8u+FRLOmoJpRJASMx9UG+jZrSkNLyRQmBXivQQwXu3m3iasMoaKYhhI0J18t8+FWktbkNTp63oEUHE9Gw0Q==", "requires": { - "@babel/runtime": "^7.4.4", - "@material-ui/styles": "^4.11.5", - "@material-ui/system": "^4.12.2", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "@types/react-transition-group": "^4.2.0", - "clsx": "^1.0.4", + "@babel/runtime": "^7.17.2" + } + }, + "@mui/material": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.6.1.tgz", + "integrity": "sha512-xg6pPq+1jxWupwmPpnfmsHNjrsOe2xynUQWrRfcH8WHrrr1sQulq0VF4gORq/l8DD8a/jb4s8SsC20e/e6mHKQ==", + "requires": { + "@babel/runtime": "^7.17.2", + "@mui/base": "5.0.0-alpha.76", + "@mui/system": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "@types/react-transition-group": "^4.4.4", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "popper.js": "1.16.1-lts", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0", - "react-transition-group": "^4.4.0" + "react-is": "^17.0.2", + "react-transition-group": "^4.4.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } } }, - "@material-ui/icons": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.3.tgz", - "integrity": "sha512-IKHlyx6LDh8n19vzwH5RtHIOHl9Tu90aAAxcbWME6kp4dmvODM3UvOHJeMIDzUbd4muuJKHmlNoBN+mDY4XkBA==", + "@mui/private-theming": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.6.1.tgz", + "integrity": "sha512-8lgh+tUt/3ftStfvml3dwAzhW3fe/cUFjLcBViOTnWk7UixWR79me4qehsO4NVj0THpu3d2qclrLzdD8qBAWAQ==", "requires": { - "@babel/runtime": "^7.4.4" + "@babel/runtime": "^7.17.2", + "@mui/utils": "^5.6.1", + "prop-types": "^15.7.2" } }, - "@material-ui/styles": { - "version": "4.11.5", - "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.5.tgz", - "integrity": "sha512-o/41ot5JJiUsIETME9wVLAJrmIWL3j0R0Bj2kCOLbSfqEkKf0fmaPt+5vtblUh5eXr2S+J/8J3DaCb10+CzPGA==", + "@mui/styled-engine": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.6.1.tgz", + "integrity": "sha512-jEhH6TBY8jc9S8yVncXmoTYTbATjEu44RMFXj6sIYfKr5NArVwTwRo3JexLL0t3BOAiYM4xsFLgfKEIvB9SAeQ==", "requires": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@emotion/cache": "^11.7.1", + "prop-types": "^15.7.2" + } + }, + "@mui/styles": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/styles/-/styles-5.6.1.tgz", + "integrity": "sha512-4BrlZIKG5vp5gKpiyKvcSGka/VBUyEI/59WnCxPU2RxNT0WLkoGlRKTU5NO+e+Ng8h7sLR9BF6yglDhMhtUJ0Q==", + "requires": { + "@babel/runtime": "^7.17.2", "@emotion/hash": "^0.8.0", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "clsx": "^1.0.4", - "csstype": "^2.5.2", + "@mui/private-theming": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "hoist-non-react-statics": "^3.3.2", - "jss": "^10.5.1", - "jss-plugin-camel-case": "^10.5.1", - "jss-plugin-default-unit": "^10.5.1", - "jss-plugin-global": "^10.5.1", - "jss-plugin-nested": "^10.5.1", - "jss-plugin-props-sort": "^10.5.1", - "jss-plugin-rule-value-function": "^10.5.1", - "jss-plugin-vendor-prefixer": "^10.5.1", + "jss": "^10.8.2", + "jss-plugin-camel-case": "^10.8.2", + "jss-plugin-default-unit": "^10.8.2", + "jss-plugin-global": "^10.8.2", + "jss-plugin-nested": "^10.8.2", + "jss-plugin-props-sort": "^10.8.2", + "jss-plugin-rule-value-function": "^10.8.2", + "jss-plugin-vendor-prefixer": "^10.8.2", "prop-types": "^15.7.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } } }, - "@material-ui/system": { - "version": "4.12.2", - "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.2.tgz", - "integrity": "sha512-6CSKu2MtmiJgcCGf6nBQpM8fLkuB9F55EKfbdTC80NND5wpTmKzwdhLYLH3zL4cLlK0gVaaltW7/wMuyTnN0Lw==", + "@mui/system": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.6.1.tgz", + "integrity": "sha512-Y5pDvEOK6VOY+0vgNeyDuEEO5QCinhXbZQDyLOlaGLKuAoRGLXO9pcSsjZoGkewYZitXD44EDfgBQ+BqsAfgUA==", "requires": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.3", - "csstype": "^2.5.2", + "@babel/runtime": "^7.17.2", + "@mui/private-theming": "^5.6.1", + "@mui/styled-engine": "^5.6.1", + "@mui/types": "^7.1.3", + "@mui/utils": "^5.6.1", + "clsx": "^1.1.1", + "csstype": "^3.0.11", "prop-types": "^15.7.2" + }, + "dependencies": { + "csstype": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.0.11.tgz", + "integrity": "sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==" + } } }, - "@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "@mui/types": { + "version": "7.1.3", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.1.3.tgz", + "integrity": "sha512-DDF0UhMBo4Uezlk+6QxrlDbchF79XG6Zs0zIewlR4c0Dt6GKVFfUtzPtHCH1tTbcSlq/L2bGEdiaoHBJ9Y1gSA==", "requires": {} }, - "@material-ui/utils": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz", - "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==", + "@mui/utils": { + "version": "5.6.1", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.6.1.tgz", + "integrity": "sha512-CPrzrkiBusCZBLWu0Sg5MJvR3fKJyK3gKecLVX012LULyqg2U64Oz04BKhfkbtBrPBbSQxM+DWW9B1c9hmV9nQ==", "requires": { - "@babel/runtime": "^7.4.4", + "@babel/runtime": "^7.17.2", + "@types/prop-types": "^15.7.4", + "@types/react-is": "^16.7.1 || ^17.0.0", "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "react-is": "^17.0.2" } }, "@nodelib/fs.scandir": { @@ -27080,6 +27551,11 @@ } } }, + "@popperjs/core": { + "version": "2.11.5", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.5.tgz", + "integrity": "sha512-9X2obfABZuDVLCgPK9aX0a/x4jaOEweTTWE2+9sr0Qqqevj2Uv5XorvusThmc9XGYpS9yI+fhh8RTafBtGposw==" + }, "@protobufjs/aspromise": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/@protobufjs/aspromise/-/aspromise-1.1.2.tgz", @@ -27941,6 +28417,14 @@ "@types/react": "^17" } }, + "@types/react-is": { + "version": "17.0.3", + "resolved": "https://registry.npmjs.org/@types/react-is/-/react-is-17.0.3.tgz", + "integrity": "sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==", + "requires": { + "@types/react": "*" + } + }, "@types/react-modal": { "version": "3.13.1", "resolved": "https://registry.npmjs.org/@types/react-modal/-/react-modal-3.13.1.tgz", @@ -30333,11 +30817,6 @@ } } }, - "csstype": { - "version": "2.6.20", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.20.tgz", - "integrity": "sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==" - }, "damerau-levenshtein": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz", @@ -32106,6 +32585,11 @@ "pkg-dir": "^4.1.0" } }, + "find-root": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/find-root/-/find-root-1.1.0.tgz", + "integrity": "sha512-NKfW6bec6GfKc0SGx1e07QZY9PE99u0Bft/0rzSD5k3sO/vwkVUpDUKVm5Gpp5Ue3YfShPFTX2070tDs5kB9Ng==" + }, "find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -37353,11 +37837,6 @@ } } }, - "popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" - }, "portfinder": { "version": "1.0.28", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.28.tgz", @@ -41675,6 +42154,11 @@ "postcss-selector-parser": "^6.0.4" } }, + "stylis": { + "version": "4.0.13", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", + "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + }, "supports-color": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz", diff --git a/package.json b/package.json index 580ee001661af..9357e9dbfd4b8 100644 --- a/package.json +++ b/package.json @@ -37,8 +37,11 @@ }, "dependencies": { "@apollo/client": "^3.5.10", - "@material-ui/core": "^4.11.4", - "@material-ui/icons": "^4.11.2", + "@emotion/react": "^11.9.0", + "@emotion/styled": "^11.8.1", + "@mui/icons-material": "^5.6.1", + "@mui/material": "^5.6.1", + "@mui/styles": "^5.6.1", "@novnc/novnc": "^1.2.0", "@types/react": "^17.0.43", "@types/react-dom": "^17.0.14",