docs: backport doc edits from future branch (#8114)

website/versioned_docs/version-2.0.1/api/plugin-methods/lifecycle-apis.md

@@ -11,7 +11,7 @@ During the build, plugins are loaded in parallel to fetch their own contents and
 
 Plugins should use this lifecycle to fetch from data sources (filesystem, remote API, headless CMS, etc.) or do some server processing. The return value is the content it needs.
 
-For example, this plugin below return a random integer between 1 to 10 as content.
+For example, this plugin below returns a random integer between 1 to 10 as content.
 
 ```js title="docusaurus-plugin/src/index.js"
 module.exports = function (context, options) {

website/versioned_docs/version-2.0.1/guides/markdown-features/markdown-features-react.mdx

@@ -507,11 +507,13 @@ By convention, using the **`_` filename prefix** will not create any doc page an
 This is text some content from `_markdown-partial-example.mdx`.
 ```
 
+<!-- prettier-ignore-start -->
 ```jsx title="someOtherDoc.mdx"
 import PartialExample from './_markdown-partial-example.mdx';
 
-<PartialExample name="Sebastien" />;
+<PartialExample name="Sebastien" />
 ```
+<!-- prettier-ignore-end -->
 
 ```mdx-code-block
 import PartialExample from './_markdown-partial-example.mdx';

website/versioned_docs/version-2.0.1/guides/markdown-features/markdown-features-toc.mdx

@@ -49,7 +49,7 @@ A special Markdown syntax lets you set an **explicit heading id**:
 
 :::tip
 
-Use the **[write-heading-ids](../../cli.md#docusaurus-write-heading-ids-sitedir)** CLI command to add explicit IDs to all your Markdown documents.
+Use the **[`write-heading-ids`](../../cli.md#docusaurus-write-heading-ids-sitedir)** CLI command to add explicit IDs to all your Markdown documents.
 
 :::
 
@@ -59,9 +59,46 @@ Generated heading IDs will be guaranteed to be unique on each page, but if you u
 
 :::
 
+## Table of contents heading level {#table-of-contents-heading-level}
+
+Each Markdown document displays a table of contents on the top-right corner. By default, this table only shows h2 and h3 headings, which should be sufficient for an overview of the page structure. In case you need to change the range of headings displayed, you can customize the minimum and maximum heading level — either per page or globally.
+
+To set the heading level for a particular page, use the `toc_min_heading_level` and `toc_max_heading_level` front matter.
+
+```md title="myDoc.md"
+---
+# Display h2 to h5 headings
+toc_min_heading_level: 2
+toc_max_heading_level: 5
+---
+```
+
+To set the heading level for _all_ pages, use the [`themeConfig.tableOfContents`](../../api/themes/theme-configuration.md#table-of-contents) option.
+
+```js title="docusaurus.config.js"
+module.exports = {
+  themeConfig: {
+    tableOfContents: {
+      // highlight-start
+      minHeadingLevel: 2,
+      maxHeadingLevel: 5,
+      // highlight-end
+    },
+  },
+};
+```
+
+If you've set the options globally, you can still override them locally via front matter.
+
+:::note
+
+The `themeConfig` option would apply to all TOC on the site, including [inline TOC](#inline-table-of-contents), but front matter options only affect the top-right TOC. You need to use the `minHeadingLevel` and `maxHeadingLevel` props to customize each `<TOCInline />` component.
+
+:::
+
 ## Inline table of contents {#inline-table-of-contents}
 
-Each Markdown document displays a table of contents on the top-right corner. But it is also possible to display an inline table of contents directly inside a Markdown document, thanks to MDX.
+It is also possible to display an inline table of contents directly inside a Markdown document, thanks to MDX.
 
 The `toc` variable is available in any MDX document and contains all the headings of an MDX document. By default, only `h2` and `h3` headings are displayed in the TOC. You can change which heading levels are visible by setting `minHeadingLevel` or `maxHeadingLevel` for individual `TOCInline` components.
 

website/versioned_docs/version-2.0.1/i18n/i18n-crowdin.mdx

@@ -194,6 +194,8 @@ Add a `crowdin` script:
 ```json title="package.json"
 {
   "scripts": {
+    // ...
+    "write-translations": "docusaurus write-translations",
     "crowdin": "crowdin"
   }
 }

website/versioned_docs/version-2.0.1/swizzling.md

@@ -39,7 +39,7 @@ Docusaurus provides an convenient **interactive CLI** to swizzle components. You
 npm run swizzle
 ```
 
-It will generate a new component your `src/theme` directory, which should look like this example:
+It will generate a new component in your `src/theme` directory, which should look like this example:
 
 ```mdx-code-block
 <Tabs>

website/versioned_docs/version-2.0.1/typescript-support.md

@@ -28,7 +28,10 @@ Then add `tsconfig.json` to your project root with the following content:
 
 ```json title="tsconfig.json"
 {
-  "extends": "@tsconfig/docusaurus/tsconfig.json"
+  "extends": "@tsconfig/docusaurus/tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": "."
+  }
 }
 ```
 

website/versioned_docs/version-2.1.0/api/plugin-methods/lifecycle-apis.md

@@ -11,7 +11,7 @@ During the build, plugins are loaded in parallel to fetch their own contents and
 
 Plugins should use this lifecycle to fetch from data sources (filesystem, remote API, headless CMS, etc.) or do some server processing. The return value is the content it needs.
 
-For example, this plugin below return a random integer between 1 to 10 as content.
+For example, this plugin below returns a random integer between 1 to 10 as content.
 
 ```js title="docusaurus-plugin/src/index.js"
 module.exports = function (context, options) {

website/versioned_docs/version-2.1.0/guides/markdown-features/markdown-features-react.mdx

@@ -507,11 +507,13 @@ By convention, using the **`_` filename prefix** will not create any doc page an
 This is text some content from `_markdown-partial-example.mdx`.
 ```
 
+<!-- prettier-ignore-start -->
 ```jsx title="someOtherDoc.mdx"
 import PartialExample from './_markdown-partial-example.mdx';
 
-<PartialExample name="Sebastien" />;
+<PartialExample name="Sebastien" />
 ```
+<!-- prettier-ignore-end -->
 
 ```mdx-code-block
 import PartialExample from './_markdown-partial-example.mdx';

website/versioned_docs/version-2.1.0/guides/markdown-features/markdown-features-toc.mdx

@@ -49,7 +49,7 @@ A special Markdown syntax lets you set an **explicit heading id**:
 
 :::tip
 
-Use the **[write-heading-ids](../../cli.md#docusaurus-write-heading-ids-sitedir)** CLI command to add explicit IDs to all your Markdown documents.
+Use the **[`write-heading-ids`](../../cli.md#docusaurus-write-heading-ids-sitedir)** CLI command to add explicit IDs to all your Markdown documents.
 
 :::
 
@@ -59,9 +59,46 @@ Generated heading IDs will be guaranteed to be unique on each page, but if you u
 
 :::
 
+## Table of contents heading level {#table-of-contents-heading-level}
+
+Each Markdown document displays a table of contents on the top-right corner. By default, this table only shows h2 and h3 headings, which should be sufficient for an overview of the page structure. In case you need to change the range of headings displayed, you can customize the minimum and maximum heading level — either per page or globally.
+
+To set the heading level for a particular page, use the `toc_min_heading_level` and `toc_max_heading_level` front matter.
+
+```md title="myDoc.md"
+---
+# Display h2 to h5 headings
+toc_min_heading_level: 2
+toc_max_heading_level: 5
+---
+```
+
+To set the heading level for _all_ pages, use the [`themeConfig.tableOfContents`](../../api/themes/theme-configuration.md#table-of-contents) option.
+
+```js title="docusaurus.config.js"
+module.exports = {
+  themeConfig: {
+    tableOfContents: {
+      // highlight-start
+      minHeadingLevel: 2,
+      maxHeadingLevel: 5,
+      // highlight-end
+    },
+  },
+};
+```
+
+If you've set the options globally, you can still override them locally via front matter.
+
+:::note
+
+The `themeConfig` option would apply to all TOC on the site, including [inline TOC](#inline-table-of-contents), but front matter options only affect the top-right TOC. You need to use the `minHeadingLevel` and `maxHeadingLevel` props to customize each `<TOCInline />` component.
+
+:::
+
 ## Inline table of contents {#inline-table-of-contents}
 
-Each Markdown document displays a table of contents on the top-right corner. But it is also possible to display an inline table of contents directly inside a Markdown document, thanks to MDX.
+It is also possible to display an inline table of contents directly inside a Markdown document, thanks to MDX.
 
 The `toc` variable is available in any MDX document and contains all the headings of an MDX document. By default, only `h2` and `h3` headings are displayed in the TOC. You can change which heading levels are visible by setting `minHeadingLevel` or `maxHeadingLevel` for individual `TOCInline` components.
 

website/versioned_docs/version-2.1.0/i18n/i18n-crowdin.mdx

@@ -194,6 +194,8 @@ Add a `crowdin` script:
 ```json title="package.json"
 {
   "scripts": {
+    // ...
+    "write-translations": "docusaurus write-translations",
     "crowdin": "crowdin"
   }
 }

website/versioned_docs/version-2.1.0/swizzling.md

@@ -39,7 +39,7 @@ Docusaurus provides an convenient **interactive CLI** to swizzle components. You
 npm run swizzle
 ```
 
-It will generate a new component your `src/theme` directory, which should look like this example:
+It will generate a new component in your `src/theme` directory, which should look like this example:
 
 ```mdx-code-block
 <Tabs>

website/versioned_docs/version-2.1.0/typescript-support.md

@@ -28,7 +28,10 @@ Then add `tsconfig.json` to your project root with the following content:
 
 ```json title="tsconfig.json"
 {
-  "extends": "@tsconfig/docusaurus/tsconfig.json"
+  "extends": "@tsconfig/docusaurus/tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": "."
+  }
 }
 ```