Support React 18 (#482)

* Update react peerDependencies

* Update examples to use react 18

examples/mobx-example/index.js

@@ -1,15 +1,17 @@
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { Provider } from 'mobx-react';
 import { SnackbarProvider } from 'notistack';
 import store from './store/store';
 import App from './App';
 
-render(
+const container = document.getElementById('root');
+const root = createRoot(container);
+
+root.render(
     <Provider store={store}>
         <SnackbarProvider>
             <App />
         </SnackbarProvider>
-    </Provider>,
-    document.getElementById('root'),
+    </Provider>
 );

examples/redux-example/index.js

@@ -2,7 +2,7 @@
  * CREDIT to GitHub@natepage for this example
  */
 import React from 'react';
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import { createStore, combineReducers } from 'redux';
 import { Provider } from 'react-redux';
 import { SnackbarProvider } from 'notistack';
@@ -11,11 +11,13 @@ import App from './App';
 
 const store = createStore(combineReducers({ app: reducers }));
 
-render(
+const container = document.getElementById('root');
+const root = createRoot(container);
+
+root.render(
     <Provider store={store}>
         <SnackbarProvider>
             <App />
         </SnackbarProvider>
-    </Provider>,
-    document.getElementById('root'),
+    </Provider>
 );

examples/simple-example/index.js

@@ -1,5 +1,7 @@
 import React from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-ReactDOM.render(<App />, document.getElementById('root'));
+const container = document.getElementById('root');
+const root = createRoot(container);
+root.render(<App />);

package.json

@@ -27,8 +27,8 @@
         "@emotion/react": "^11.4.1",
         "@emotion/styled": "^11.3.0",
         "@mui/material": "^5.0.0",
-        "react": "^16.8.0 || ^17.0.0",
-        "react-dom": "^16.8.0 || ^17.0.0"
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
     },
     "peerDependenciesMeta": {
         "@emotion/react": {