diff --git a/packages/new-design/lib/config.mjs b/packages/new-design/lib/config.mjs
index e70cc8906f4..209cdd451a0 100644
--- a/packages/new-design/lib/config.mjs
+++ b/packages/new-design/lib/config.mjs
@@ -136,6 +136,7 @@ yarn-error.log*
       'shared/components/mdx/highlight.mjs',
       'shared/components/mdx/http.mjs',
       'shared/components/mdx/index.mjs',
+      'shared/components/mdx/mermaid.mjs',
       'shared/components/mdx/prev-next.mjs',
       'shared/components/mdx/read-more.mjs',
       'shared/components/mdx/tabbed-example.mjs',
diff --git a/packages/new-design/templates/shared/package.json.mustache b/packages/new-design/templates/shared/package.json.mustache
index 0b595c2d636..c2f472680f5 100644
--- a/packages/new-design/templates/shared/package.json.mustache
+++ b/packages/new-design/templates/shared/package.json.mustache
@@ -72,6 +72,7 @@
     "lodash.unset": "^4.5.2",
     "lodash.clonedeep": "^4.5.0",
     "next": "^13",
+    "mermaid": "10.1.0",
     "next-i18next": "^11.0.0",
     "pdfkit": "^0.13.0",
     "react-copy-to-clipboard": "^5.0.4",
@@ -83,7 +84,6 @@
     "autoprefixer": "^10.4.0",
     "eslint-config-next": "12.1.6",
     "highlight.js": "^11.5.1",
-    "js-yaml": "^4.1.0",
     "postcss": "^8.4.14",
     "postcss-for": "^2.1.1",
     "svg-to-pdfkit": "^0.1.8",