[update docs] Bump demo deps and update to next 13

GMOD · Nov 21, 2022 · 6ef53c8 · 6ef53c8
1 parent 8969974
commit 6ef53c8
Show file tree

Hide file tree

Showing 15 changed files with 10,436 additions and 8,703 deletions.
diff --git a/demos/jbrowse-react-circular-genome-view-cra5/tsconfig.json b/demos/jbrowse-react-circular-genome-view-cra5/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2018",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,

diff --git a/demos/jbrowse-react-circular-genome-view-cra5/yarn.lock b/demos/jbrowse-react-circular-genome-view-cra5/yarn.lock
diff --git a/demos/jbrowse-react-circular-genome-view/package.json b/demos/jbrowse-react-circular-genome-view/package.json
@@ -11,8 +11,8 @@
     "@testing-library/user-event": "^12.1.10",
     "@types/jest": "^26.0.15",
     "@types/node": "^12.0.0",
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-scripts": "4.0.3",

diff --git a/demos/jbrowse-react-circular-genome-view/tsconfig.json b/demos/jbrowse-react-circular-genome-view/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2015",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,

diff --git a/demos/jbrowse-react-circular-genome-view/yarn.lock b/demos/jbrowse-react-circular-genome-view/yarn.lock
diff --git a/demos/jbrowse-react-linear-genome-view-cra5/tsconfig.json b/demos/jbrowse-react-linear-genome-view-cra5/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2018",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,

diff --git a/demos/jbrowse-react-linear-genome-view-cra5/yarn.lock b/demos/jbrowse-react-linear-genome-view-cra5/yarn.lock
diff --git a/demos/jbrowse-react-linear-genome-view-nextjs/package.json b/demos/jbrowse-react-linear-genome-view-nextjs/package.json
@@ -14,14 +14,16 @@
   "dependencies": {
     "@fontsource/roboto": "^4.5.7",
     "@jbrowse/react-linear-genome-view": "^2.0.0",
-    "next": "^12.1.0",
-    "react": "^17.0.0",
-    "react-dom": "^17.0.0"
+    "next": "^13.0.4",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
   },
   "devDependencies": {
-    "@types/node": "17.0.41",
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.0",
-    "typescript": "4.7.3"
+    "@types/node": "18.11.9",
+    "@types/react": "^18.0.25",
+    "@types/react-dom": "^18.0.9",
+    "eslint": "8.28.0",
+    "eslint-config-next": "13.0.4",
+    "typescript": "4.9.3"
   }
 }
diff --git a/demos/jbrowse-react-linear-genome-view-nextjs/tsconfig.json b/demos/jbrowse-react-linear-genome-view-nextjs/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2018",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,

diff --git a/demos/jbrowse-react-linear-genome-view-nextjs/yarn.lock b/demos/jbrowse-react-linear-genome-view-nextjs/yarn.lock
diff --git a/demos/jbrowse-react-linear-genome-view-vite/yarn.lock b/demos/jbrowse-react-linear-genome-view-vite/yarn.lock
diff --git a/demos/jbrowse-react-linear-genome-view/package.json b/demos/jbrowse-react-linear-genome-view/package.json
@@ -10,8 +10,8 @@
     "@testing-library/user-event": "^12.1.10",
     "@types/jest": "^26.0.15",
     "@types/node": "^12.0.0",
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.0",
+    "@types/react": "^18.0.0",
+    "@types/react-dom": "^18.0.0",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-scripts": "4.0.3",

diff --git a/demos/jbrowse-react-linear-genome-view/tsconfig.json b/demos/jbrowse-react-linear-genome-view/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "es2018",
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,

diff --git a/demos/jbrowse-react-linear-genome-view/yarn.lock b/demos/jbrowse-react-linear-genome-view/yarn.lock
diff --git a/website/docs/embedded_components.md b/website/docs/embedded_components.md
@@ -21,7 +21,7 @@ using different bundlers
 
 | Bundler             | Demo                                            | Source code                                                                                                                                                                                                                                                                                          | Note                                                                                                                                                                                                                                                                         |
 | ------------------- | ----------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| create-react-app v4 | [demo](https://jbrowse.org/demos/lgv/)          | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-linear-genome-view) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-linear-genome-view))                     | no polyfills needed in create-react-app v4                                                                                                                                                                                                                                   |
+| create-react-app v4 | [demo](https://jbrowse.org/demos/lgv/)          | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-linear-genome-view) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-linear-genome-view))                     | no polyfills needed in create-react-app v4. on newer versions of node, you can need to use `export NODE_OPTIONS=--openssl-legacy-provider` before building cra4 apps                                                                                                         |
 | create-react-app v5 | [demo](https://jbrowse.org/demos/lgv-cra5/)     | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-linear-genome-view-cra5) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-linear-genome-view-cra5))           | for create-react-app v5, we use craco to update the webpack config to polyfill some node modules. This demo also uses webworkers, which is a unique ability with webpack 5. See https://jbrowse.org/storybook/lgv/main/?path=/story/linear-view--with-web-worker for details |
 | vite                | [demo](https://jbrowse.org/demos/lgv-vite)      | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-linear-genome-view-vite) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-linear-genome-view-vite))           | for vite, we use rollup to polyfill some node polyfills similar to craco in create-react-app v5. note, may not work with newly released vite 3.x, works in dev but fails in production so this example uses vite 2.x                                                         |
 | next.js             | [demo](https://jbrowse.org/demos/lgv-nextjs)    | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-linear-genome-view-nextjs) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-linear-genome-view-nextjs))       | uses next.js 12. Also see next.config.js to update basePath as needed                                                                                                                                                                                                        |
@@ -38,8 +38,8 @@ This component consists of a single JBrowse 2 circular view.
 Here is a table of different usages of the
 `@jbrowse/react-circular-genome-view` using different bundlers
 
-| Syntax              | Demo                                            | Source code                                                                                                                                                                                                                                                                                              | Note                                                                                             |
-| ------------------- | ----------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------ |
-| create-react-app v4 | [demo](https://jbrowse.org/demos/cgv/)          | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-circular-genome-view) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-circular-genome-view))                     | no polyfills needed in create-react-app v4                                                       |
-| create-react-app v5 | [demo](https://jbrowse.org/demos/cgv-cra5/)     | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-circular-genome-view-cra5) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-circular-genome-view-cra5))           | for create-react-app v5, we use craco to update the webpack config to polyfill some node modules |
-| vanilla js          | [demo](https://jbrowse.org/demos/cgv-vanillajs) | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-circular-genome-view-vanillajs) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-circular-genome-view-vanillajs)) | uses a script tag to include a UMD bundle, and doesn't require any transpilation or bundling     |
+| Syntax              | Demo                                            | Source code                                                                                                                                                                                                                                                                                              | Note                                                                                                                                                                 |
+| ------------------- | ----------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| create-react-app v4 | [demo](https://jbrowse.org/demos/cgv/)          | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-circular-genome-view) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-circular-genome-view))                     | no polyfills needed in create-react-app v4. on newer versions of node, you can need to use `export NODE_OPTIONS=--openssl-legacy-provider` before building cra4 apps |
+| create-react-app v5 | [demo](https://jbrowse.org/demos/cgv-cra5/)     | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-circular-genome-view-cra5) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-circular-genome-view-cra5))           | for create-react-app v5, we use craco to update the webpack config to polyfill some node modules                                                                     |
+| vanilla js          | [demo](https://jbrowse.org/demos/cgv-vanillajs) | [source code](https://github.com/GMOD/jbrowse-components/tree/main/demos/jbrowse-react-circular-genome-view-vanillajs) ([download](https://download-directory.github.io/?url=https%3A%2F%2Fgithub.com%2FGMOD%2Fjbrowse-components%2Ftree%2Fmain%2Fdemos%2Fjbrowse-react-circular-genome-view-vanillajs)) | uses a script tag to include a UMD bundle, and doesn't require any transpilation or bundling                                                                         |