Update for @Mui5

package.json

@@ -1,6 +1,6 @@
 {
   "name": "material-ui-banner",
-  "version": "2.1.5",
+  "version": "3.0.0",
   "description": "A material-ui component that allows you to add a banner underneath the app bar.",
   "main": "dist/index.js",
   "scripts": {
@@ -39,12 +39,9 @@
     "prop-types": "^15.7.2"
   },
   "peerDependencies": {
+    "@mui/material": "^5.0.1",
+    "@mui/styles": "^5.0.1",
     "clsx": "^1.1.1",
-    "@emotion/react": "^11.1.1",
-    "@emotion/styled": "^11.0.0",
-    "@material-ui/core": "^5.0.0-alpha.36",
-    "@material-ui/styled-engine": "^5.0.0-alpha.34",
-    "@material-ui/styles": "^5.0.0-alpha.35",
     "react": "^17.0.1",
     "react-dom": "^17.0.1"
   }

src/components/Banner.jsx

@@ -5,8 +5,8 @@ import {
   Paper, Card, Grid, Typography,
   Button, Divider, ButtonBase, CardActions,
   CardContent, Avatar, Collapse, Container,
-} from '@material-ui/core';
-import makeStyles from '@material-ui/styles/makeStyles';
+} from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
 import { Hide, useIsMobile } from './Hide';
 
 const useStyles = makeStyles((theme) => ({

src/components/Hide.jsx

@@ -1,4 +1,4 @@
-import { useMediaQuery } from '@material-ui/core';
+import { useMediaQuery } from '@mui/material';
 
 /**
  * Checks whether or not the current device is a mobile device, based on device width

src/components/StaticBanner.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import ButtonBase from '@material-ui/core/ButtonBase';
+import ButtonBase from '@mui/material/ButtonBase';
 import Banner from './Banner';
 
 export default class StaticBanner extends React.Component {

src/demo/components/App.jsx

@@ -2,8 +2,8 @@ import React, { useCallback } from 'react';
 import {
   AppBar, Toolbar, Typography, Button,
   Grid, Card,
-} from '@material-ui/core';
-import makeStyles from '@material-ui/styles/makeStyles';
+} from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
 import { Banner, StaticBanner } from '../../index';
 
 const useStyles = makeStyles((theme) => ({

src/demo/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { render } from 'react-dom';
-import createTheme from '@material-ui/core/styles/createTheme';
-import ThemeProvider from '@material-ui/core/styles/ThemeProvider';
+import createTheme from '@mui/material/styles/createTheme';
+import ThemeProvider from '@mui/material/styles/ThemeProvider';
 import App from './components/App';
 
 const theme = createTheme();

webpack.config.build.js

@@ -25,8 +25,8 @@ module.exports = merge(common, {
         amd: 'react-dom',
       },
     },
-    "@material-ui/core",
-    /@material-ui\/core\/*./,
+    "@mui/material",
+    /@mui\/material\/*./,
     'clsx',
   ],
   plugins: [