diff --git a/docs/docs/getting-started.mdx b/docs/docs/getting-started.mdx
index f505ec92bd..21e8f4e710 100644
--- a/docs/docs/getting-started.mdx
+++ b/docs/docs/getting-started.mdx
@@ -27,8 +27,8 @@ LiveCodes [<abbr title="Software Development Kit">SDK</abbr>](./sdk/index.mdx) i
 
 Install from npm.
 
-```shell
-npm i livecodes
+```bash npm2yarn
+npm install livecodes
 ```
 
 then you can use it like that:
diff --git a/docs/docs/languages/vue.mdx b/docs/docs/languages/vue.mdx
index 34185c08f0..c9bf29a45a 100644
--- a/docs/docs/languages/vue.mdx
+++ b/docs/docs/languages/vue.mdx
@@ -408,7 +408,7 @@ Using [Prettier](https://prettier.io/).
 Currently, Vue support has the following limitations:
 
 - SSR is not supported.
-- The [`defineProps()`](https://vuejs.org/guide/components/props#props-declaration) macro cannot infer props from TypeScript types. Props have to be explicitly declared.
+- The [`defineProps()`](https://vuejs.org/guide/components/props#props-declaration) macro cannot infer props from TypeScript types not defined in the same file.
 
 [PRs are welcome](https://github.com/live-codes/livecodes/issues/757).
 
diff --git a/docs/docs/sdk/index.mdx b/docs/docs/sdk/index.mdx
index e3097de7af..129600f395 100644
--- a/docs/docs/sdk/index.mdx
+++ b/docs/docs/sdk/index.mdx
@@ -31,8 +31,8 @@ This is an example of an editable embedded playground using the SDK.
 This is a single npm package for the SDK which supports JavaScript/TypeScript, React, Vue and Svelte.
 Install the library from npm:
 
-```sh
-npm i livecodes
+```bash npm2yarn
+npm install livecodes
 ```
 
 then it can be used like that:
@@ -116,6 +116,6 @@ A demo page that shows the usage of the SDK can be [found here](https://live-cod
 
 Or edit the SDK playground in LiveCodes. How meta! :)
 
-<LiveCodes import="id/nqdxpnj6uvg" view="result" height="80vh" showCode={false} />
+<LiveCodes import="id/8k6vbxitvb9" config={{ view: 'result' }} height="80vh" showCode={false} />
 
 P.S. You may want to use the "Full Screen" button!
diff --git a/docs/docusaurus.config.ts b/docs/docusaurus.config.ts
index d721ea6e80..1dc24cef69 100644
--- a/docs/docusaurus.config.ts
+++ b/docs/docusaurus.config.ts
@@ -35,6 +35,12 @@ const config: Config = {
             const sidebarItems = await defaultSidebarItemsGenerator(args);
             return excludeSidebarItems(sidebarItems);
           },
+          remarkPlugins: [
+            [
+              require('@docusaurus/remark-plugin-npm2yarn'),
+              { sync: true, converters: ['yarn', 'pnpm', 'bun'] },
+            ],
+          ],
         },
         blog: false,
         theme: {
@@ -220,6 +226,7 @@ const config: Config = {
     prism: {
       theme: lightCodeTheme,
       darkTheme: darkCodeTheme,
+      additionalLanguages: ['bash'],
     },
     algolia: {
       appId: 'H9Z2PKYS80',
diff --git a/docs/package-lock.json b/docs/package-lock.json
index 740f618b8c..ed96a4c01d 100644
--- a/docs/package-lock.json
+++ b/docs/package-lock.json
@@ -12,6 +12,7 @@
         "@docusaurus/faster": "3.7.0",
         "@docusaurus/plugin-client-redirects": "3.7.0",
         "@docusaurus/preset-classic": "3.7.0",
+        "@docusaurus/remark-plugin-npm2yarn": "3.7.0",
         "@mdx-js/react": "3.1.0",
         "clsx": "2.1.1",
         "prism-react-renderer": "2.4.1",
@@ -3593,6 +3594,21 @@
         "react-dom": "^18.0.0 || ^19.0.0"
       }
     },
+    "node_modules/@docusaurus/remark-plugin-npm2yarn": {
+      "version": "3.7.0",
+      "resolved": "https://registry.npmjs.org/@docusaurus/remark-plugin-npm2yarn/-/remark-plugin-npm2yarn-3.7.0.tgz",
+      "integrity": "sha512-2QkZh75vZzPefW5Ljt8gwc1i0ERuS0MRZTEwHsSXSi6vc2NpLVbcmfIuHhwR8o0PcGVTxmBEhQRP0NN1vHdOAA==",
+      "dependencies": {
+        "mdast-util-mdx": "^3.0.0",
+        "npm-to-yarn": "^3.0.0",
+        "tslib": "^2.6.0",
+        "unified": "^11.0.3",
+        "unist-util-visit": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18.0"
+      }
+    },
     "node_modules/@docusaurus/theme-classic": {
       "version": "3.7.0",
       "resolved": "https://registry.npmjs.org/@docusaurus/theme-classic/-/theme-classic-3.7.0.tgz",
@@ -12810,6 +12826,17 @@
         "node": ">=8"
       }
     },
+    "node_modules/npm-to-yarn": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/npm-to-yarn/-/npm-to-yarn-3.0.1.tgz",
+      "integrity": "sha512-tt6PvKu4WyzPwWUzy/hvPFqn+uwXO0K1ZHka8az3NnrhWJDmSqI8ncWq0fkL0k/lmmi5tAC11FXwXuh0rFbt1A==",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/nebrelbug/npm-to-yarn?sponsor=1"
+      }
+    },
     "node_modules/nprogress": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/nprogress/-/nprogress-0.2.0.tgz",
diff --git a/docs/package.json b/docs/package.json
index fc672ac889..6ee98b01d3 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -19,6 +19,7 @@
     "@docusaurus/faster": "3.7.0",
     "@docusaurus/plugin-client-redirects": "3.7.0",
     "@docusaurus/preset-classic": "3.7.0",
+    "@docusaurus/remark-plugin-npm2yarn": "3.7.0",
     "@mdx-js/react": "3.1.0",
     "clsx": "2.1.1",
     "prism-react-renderer": "2.4.1",