From 1890bc2d472ef7047aa2469dc2f58976ad8315ab Mon Sep 17 00:00:00 2001
From: Joshua Chen <sidachen2003@gmail.com>
Date: Fri, 29 Apr 2022 17:03:19 +0800
Subject: [PATCH] docs: wrap code blocks in mdx-code-block

---
 .../markdown-features/markdown-features-code-blocks.mdx   | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx b/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx
index bb16c7e47c97..4aa83b57dbe2 100644
--- a/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx
+++ b/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx
@@ -234,6 +234,7 @@ export default MyComponent;
 ```
 ````
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx {1,4-6,11}
@@ -251,6 +252,7 @@ export default MyComponent;
 ```
 
 </BrowserWindow>
+````
 
 :::tip prefer comments
 
@@ -294,6 +296,7 @@ export default MyComponent;
 ```
 ````
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx {1,4-6,11} showLineNumbers
@@ -311,6 +314,7 @@ export default MyComponent;
 ```
 
 </BrowserWindow>
+````
 
 ## Interactive code editor {#interactive-code-editor}
 
@@ -361,6 +365,7 @@ function Clock(props) {
 
 The code block will be rendered as an interactive editor. Changes to the code will reflect on the result panel live.
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx live
@@ -387,6 +392,7 @@ function Clock(props) {
 ```
 
 </BrowserWindow>
+````
 
 ### Imports {#imports}
 
@@ -435,6 +441,7 @@ export default ReactLiveScope;
 
 The `ButtonExample` component is now available to use:
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx live
@@ -448,6 +455,7 @@ function MyPlayground(props) {
 ```
 
 </BrowserWindow>
+````
 
 ## Using JSX markup in code blocks {#using-jsx-markup}