Merge pull request #374 from tjallingt/feat/react-18

feat: upgrade to React 18

.github/workflows/tests.yml

@@ -22,7 +22,7 @@ jobs:
     name: Node.js ${{ matrix.node }}
     strategy:
       matrix:
-        node: ['14.x', '16.x', '17.x', '18.x']
+        node: ['14.x', '16.x', '18.x']
     steps:
       - name: Checkout
         uses: actions/checkout@v3

package.json

@@ -10,19 +10,19 @@
     "prepare": "husky install"
   },
   "devDependencies": {
-    "@commitlint/cli": "17.0.3",
-    "@commitlint/config-conventional": "17.0.3",
-    "@typescript-eslint/eslint-plugin": "5.30.4",
-    "@typescript-eslint/parser": "5.30.4",
-    "eslint": "8.19.0",
+    "@commitlint/cli": "17.1.2",
+    "@commitlint/config-conventional": "17.1.0",
+    "@typescript-eslint/eslint-plugin": "5.36.2",
+    "@typescript-eslint/parser": "5.36.2",
+    "eslint": "8.23.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-config-react-app": "7.0.1",
     "eslint-plugin-prettier": "4.2.1",
     "husky": "8.0.1",
     "lint-staged": "13.0.3",
     "prettier": "2.7.1",
-    "turbo": "1.3.1",
-    "typescript": "4.7.4"
+    "turbo": "1.4.6",
+    "typescript": "4.8.3"
   },
   "lint-staged": {
     "*.js": "eslint --cache --cache-location node_modules/.cache/eslint --ext .ts,.tsx,.js,.jsx --fix",

packages/example-ssr/package.json

@@ -8,15 +8,15 @@
     "start": "next start"
   },
   "dependencies": {
-    "next": "12.1.6",
+    "next": "12.3.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-youtube": "1.0.0"
   },
   "devDependencies": {
-    "@types/node": "17.0.35",
-    "@types/react": "18.0.14",
-    "@types/react-dom": "18.0.5",
-    "typescript": "4.7.4"
+    "@types/node": "18.7.16",
+    "@types/react": "18.0.18",
+    "@types/react-dom": "18.0.6",
+    "typescript": "4.8.3"
   }
 }

packages/example/package.json

@@ -8,16 +8,16 @@
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist"
   },
   "dependencies": {
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
     "react-youtube": "1.0.0"
   },
   "devDependencies": {
-    "@types/react": "17.0.20",
-    "@types/react-dom": "17.0.9",
-    "parcel": "2.5.0",
+    "@types/react": "18.0.18",
+    "@types/react-dom": "18.0.6",
+    "parcel": "2.7.0",
     "process": "0.11.10",
-    "typescript": "4.7.4"
+    "typescript": "4.8.3"
   },
   "keywords": [
     "javascript",

packages/example/src/index.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import ReactDOM from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import YouTube, { YouTubePlayer } from 'react-youtube';
 
 import './styles.css';
@@ -61,4 +61,6 @@ function YouTubeComponentExample() {
   );
 }
 
-ReactDOM.render(<YouTubeComponentExample />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container!);
+root.render(<YouTubeComponentExample />);

packages/react-youtube/package.json

@@ -32,19 +32,20 @@
     "youtube-player": "5.5.2"
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "5.16.4",
-    "@testing-library/react": "12.1.4",
-    "@types/jest": "27.4.1",
-    "@types/react": "17.0.20",
-    "@types/react-dom": "17.0.9",
+    "@testing-library/jest-dom": "5.16.5",
+    "@testing-library/react": "13.4.0",
+    "@types/jest": "29.0.0",
+    "@types/react": "18.0.18",
+    "@types/react-dom": "18.0.6",
     "@types/youtube-player": "5.5.6",
-    "jest": "27.5.1",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
-    "semantic-release": "19.0.3",
+    "jest": "29.0.2",
+    "jest-environment-jsdom": "29.0.2",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "semantic-release": "19.0.5",
     "semantic-release-monorepo": "7.0.5",
-    "ts-jest": "27.1.4",
-    "tsup": "6.1.3"
+    "ts-jest": "29.0.0",
+    "tsup": "6.2.3"
   },
   "peerDependencies": {
     "react": ">=0.14.1"