chore(website): upgrade Docusaurus from v2 to v3

package.json

@@ -1,6 +1,9 @@
 {
   "name": "root",
   "private": false,
+  "overrides": {
+    "webpackbar": "7.0.0"
+  },
   "devDependencies": {
     "@changesets/changelog-github": "^0.4.4",
     "@changesets/cli": "^2.20.0",

packages/configure/test/tasks/run.test.ts

@@ -53,7 +53,7 @@ describe('task: run', () => {
     await loadYamlConfig(ctx, join(dir, 'basic.yml'));
   });
 
-  it('should run operations', async () => {
+  it('should run operations', { timeout: 120000 }, async () => {
     const dir = temporaryDirectory();
 
     await copy('../common/test/fixtures/ios-and-android', dir);

packages/project/package.json

@@ -53,6 +53,7 @@
     "@types/fs-extra": "^9.0.13",
     "@types/ini": "^1.3.31",
     "@types/lodash": "^4.14.175",
+    "@types/prettier": "^2.7.3",
     "@types/plist": "^3.0.2",
     "rimraf": "^6.0.1",
     "typescript": "^5.9.3",

packages/project/src/util/xml.ts

@@ -3,7 +3,7 @@
 import { dirname } from 'path';
 import { readFile, writeFile } from '@ionic/utils-fs';
 import xmldom, { XMLSerializer } from '@xmldom/xmldom';
-import prettier from 'prettier/standalone';
+import prettier from 'prettier';
 import prettierXml from '@prettier/plugin-xml';
 
 export async function parseXml(filename: string): Promise<Document> {

packages/project/tsconfig.json

@@ -16,7 +16,7 @@
     "noUnusedLocals": false,
     "noUnusedParameters": false,
     "target": "es2019",
-    "types": ["node", "cross-spawn", "diff", "fs-extra", "ini", "lodash", "plist"]
+    "types": ["node", "cross-spawn", "diff", "fs-extra", "ini", "lodash", "plist", "prettier"]
   },
   "files": ["src/index.ts"],
   "include": ["/src/**/*.ts", "**/src/**/*.ts", "/src/**/*.d.ts"]

packages/website/docusaurus.config.js

@@ -1,8 +1,9 @@
 // @ts-check
 // Note: type annotations allow type checking and IDEs autocompletion
 
-const lightCodeTheme = require('prism-react-renderer/themes/oceanicNext');
-const darkCodeTheme = require('prism-react-renderer/themes/palenight');
+const { themes } = require('prism-react-renderer');
+const lightCodeTheme = themes.oceanicNext;
+const darkCodeTheme = themes.palenight;
 
 /** @type {import('@docusaurus/types').Config} */
 const config = {

packages/website/package.json

@@ -14,21 +14,21 @@
     "write-heading-ids": "docusaurus write-heading-ids"
   },
   "dependencies": {
-    "@docusaurus/core": "2.4.3",
-    "@docusaurus/plugin-ideal-image": "^2.0.0-rc.1",
-    "@docusaurus/preset-classic": "^2.0.0-rc.1",
+    "@docusaurus/core": "3.10.0",
+    "@docusaurus/plugin-ideal-image": "3.10.0",
+    "@docusaurus/preset-classic": "3.10.0",
     "@ionic-internal/design-system": "^0.0.0",
     "@ionic-internal/docusaurus-plugin-tag-manager": "^2.0.0",
     "@ionic/prettier-config": "^2.0.0",
-    "@mdx-js/react": "^1.6.21",
+    "@mdx-js/react": "^3.0.0",
     "@svgr/webpack": "^5.5.0",
     "clsx": "^1.1.1",
-    "docusaurus-plugin-sass": "^0.2.2",
+    "docusaurus-plugin-sass": "^0.2.6",
     "modern-normalize": "^1.1.0",
     "prettier": "^2.3.2",
-    "prism-react-renderer": "^1.3.3",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "prism-react-renderer": "^2.3.0",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
     "sass": "^1.54.0"
   },
   "browserslist": {

packages/website/src/css/custom.scss

@@ -45,11 +45,11 @@
   --docsearch-text-color: var(--c-carbon-30);
   --docsearch-searchbox-background: #fff;
   --docsearch-searchbox-focus-background: #fff;
-  --docsearch-searchbox-shadow: 0px 0px 0px 1px var(--c-indigo-30);
-  --docsearch-key-gradient: #fff;
-  --docsearch-key-shadow: 0px 0px 0px 1px var(--c-indigo-30);
+  --docsearch-subtle-color: var(--c-indigo-30);
+  --docsearch-search-button-background: #fff;
+  --docsearch-key-background: #fff;
 
-  [class*='searchBox_'] {
+  [class*='navbarSearchContainer'] {
     --ifm-navbar-item-padding-vertical: 0;
 
     flex-basis: 14rem;
@@ -59,15 +59,14 @@
     font-size: inherit;
     font-weight: 400;
 
-    box-shadow: var(--docsearch-searchbox-shadow);
-
+    box-sizing: border-box;
     width: 100%;
 
     border-radius: 8px;
 
     &:hover,
     &:focus {
-      --docsearch-searchbox-shadow: 0px 0px 0px 1px var(--c-indigo-50);
+      --docsearch-subtle-color: var(--c-indigo-50);
     }
 
     &-Container {

packages/website/vercel.json

@@ -2,6 +2,8 @@
   "cleanUrls": true,
   "redirects": [
     { "source": "/docs/configuration-tool", "destination": "/docs/operations/getting-started" },
-    { "source": "/docs/examples", "destination": "/docs/resources" }
+    { "source": "/docs/examples", "destination": "/docs/resources" },
+    { "source": "/docs/Frameworks/:path*", "destination": "/docs/frameworks/:path*" },
+    { "source": "/docs/Operations/:path*", "destination": "/docs/operations/:path*" }
   ]
 }