Publish MUI v5 compatibility as stable release (#437)

* Closes #334 #333 - Fix collapse keys * 1.0.3-alpha.0 * 1.0.4-alpha.0 * 1.0.6-alpha.0 * Fixes #355 - Update MUI peer dependency to next * 1.0.6-next.0 * Use root classKey for Collapse * 1.0.6-next.1 * Add support for Material-UI v5 beta (#418) * upgrade to material-ui v5; modify code as recommended by the material-ui docs * upgrade to material-ui v5; modify code as recommended by the material-ui docs * add missing anchor classes to SnackbarItem; fix child class declarations * update dependencies; run build * package-lock update * Allow passing classes from props * Adapt new MUI breakpoints * Bind this * Mark emotion peerDeps as optional * 1.0.6-next.2 Co-authored-by: Hossein Dehnokhalaji <[email protected]> * Support @mui/material package naming (#423) * Support Material-UI 5.0.0-rc.0 * Bump version to 1.0.6-next.3 * Remove @mui/styles dependency * Prepare next to be published as latest (#436) * Add tag for people on mui-v4 * Update simple example * Update simple example * Update redux example * Update mobx example * Minor * Update next --> latest in example codes * Update docs * Update CHANGELOG * Update MUI v5 peerDependencies * Update version to v2.0.2 * Update docs.json Co-authored-by: Joe Maffei <[email protected]> Co-authored-by: David Ramos <[email protected]>
iamhosseindhv · Sep 26, 2021 · 2160b28 · 2160b28
1 parent 54acc22
commit 2160b28
Show file tree

Hide file tree

Showing 23 changed files with 53,496 additions and 11,009 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -16,7 +16,9 @@ module.exports = {
         'react/destructuring-assignment': 0,
         'react/jsx-closing-bracket-location': 0,
         'react/sort-comp': 0,
+        'arrow-parens': 0,
         'react/require-default-props': 0,
+        'react/jsx-props-no-spreading': 0,
         'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx', '.ts', '.tsx'] }],
         'jsx-a11y/anchor-is-valid': ['error', { aspects: ['invalidHref', 'preferButton'] }],
     },

diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,11 @@
 Thanks to all contributers who improved notistack by opening an issue/PR.
 
+### `[email protected]`
+###### Sep 26, 2021
+* **@hugofpsilva** **@ramosbugs** **@joemaffei** Publish material-ui v5 compatible version as `latest` instead of `next` [#437](https://github.com/iamhosseindhv/notistack/pull/437) 
+
+<br />
+
 ### `[email protected]`
 ###### July 25, 2021
 * **@joshkel** Support Collapse with root and container class keys [#408](https://github.com/iamhosseindhv/notistack/pull/408) 

diff --git a/README.md b/README.md
@@ -37,6 +37,12 @@ npm install notistack
 yarn add notistack
 ```
 
+If you're using Material-UI version 4.x.x or lower, download a compatible version of notistack using:
+```
+npm install notistack@latest-mui-v4
+yarn add notistack@latest-mui-v4
+```
+
 ### How to use
 
 **1:** Wrap your app inside a `SnackbarProvider` component: (see [docs](https://iamhosseindhv.com/notistack/api) for a full list of available props)

diff --git a/examples/mobx-example/App.js b/examples/mobx-example/App.js
@@ -1,7 +1,7 @@
 import React, { Component, Fragment } from 'react';
 import { inject, observer } from 'mobx-react';
-import Typography from '@material-ui/core/Typography';
-import Button from '@material-ui/core/Button';
+import Typography from '@mui/material/Typography';
+import Button from '@mui/material/Button';
 import Notifier from './Notifier';
 
 class App extends Component {
@@ -21,7 +21,7 @@ class App extends Component {
                 <Typography variant="h4" gutterBottom>
                     Notistack mobx example
                 </Typography>
-                <Button variant="contained" onClick={this.handleClick}>
+                <Button variant="outlined" onClick={this.handleClick}>
                     Display snackbar
                 </Button>
             </Fragment>

diff --git a/examples/mobx-example/package.json b/examples/mobx-example/package.json
@@ -7,26 +7,36 @@
     "type": "git"
   },
   "main": "src/index.js",
+  "keywords": [
+    "react",
+    "javascript",
+    "material-ui",
+    "mui",
+    "@mui/material",
+    "emotion",
+    "@emotion/react",
+    "@emotion/styled",
+    "stacked",
+    "snackbar",
+    "notification",
+    "mobx",
+    "mobxjs"
+  ],
   "dependencies": {
-    "@material-ui/core": "^4.0.0",
-    "react": "latest",
-    "react-dom": "latest",
-    "react-scripts": "1.1.4",
-    "mobx": "^5.9.0",
-    "mobx-react": "^5.4.3",
-    "notistack": "latest"
+      "@emotion/react": "latest",
+      "@emotion/styled": "latest",
+      "@mui/material": "latest",
+      "notistack": "latest",
+      "react": "latest",
+      "react-dom": "latest",
+      "react-scripts": "latest",
+      "mobx": "^5.9.0",
+      "mobx-react": "^5.4.3"
   },
-  "devDependencies": {},
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test --env=jsdom",
     "eject": "react-scripts eject"
-  },
-  "keywords": [
-    "notistack",
-    "mobx",
-    "react",
-    "mobxjs"
-  ]
+  }
 }
diff --git a/examples/redux-example/App.js b/examples/redux-example/App.js
@@ -1,14 +1,15 @@
 import React, { Fragment } from 'react';
 import { useDispatch } from 'react-redux';
-import Typography from '@material-ui/core/Typography';
-import Button from '@material-ui/core/Button';
-import Notifier from './Notifier';
+import Typography from '@mui/material/Typography';
+import Button from '@mui/material/Button';
+import useNotifier from './useNotifier';
 import {
     enqueueSnackbar as enqueueSnackbarAction,
     closeSnackbar as closeSnackbarAction,
 } from './redux/actions';
 
 const App = () => {
+    useNotifier();
     const dispatch = useDispatch();
     const enqueueSnackbar = (...args) => dispatch(enqueueSnackbarAction(...args));
     const closeSnackbar = (...args) => dispatch(closeSnackbarAction(...args));
@@ -36,11 +37,9 @@ const App = () => {
 
     return (
         <Fragment>
-            <Notifier />
             <Typography variant="h4" gutterBottom>Notistack redux example</Typography>
-
-            <Button variant="contained" onClick={handleClick}>Display snackbar</Button>
-            <Button variant="contained" onClick={handleDimissAll}>Dismiss all snackbars</Button>
+            <Button variant="outlined" onClick={handleClick}>Display snackbar</Button>
+            <Button variant="outlined" onClick={handleDimissAll}>Dismiss all snackbars</Button>
         </Fragment>
     );
 };