feat: support code group container (#2059)

* feat: markdown support CodeGroup

feat: 基本实现

chore: update docs

chore: style

chore: update

chore: update demo

chore: update logic

feat: update logic

chore: update docs

chore: remove

chore: update

chore: clean diff

chore: update

feat: update logic

test: update test

Revert "test: update test"

This reverts commit 994414e.

test: add unit test

* chore: fix ts lint

* chore: update code-group style

* chore: update

* test: update unit test

* Update src/loaders/markdown/transformer/remarkContainer.ts

Co-authored-by: Peach <scdzwyxst@gmail.com>

* chore: update logic

* chore: remove ts type

* feat: updata tabs comp

* chore: unified naming

---------

Co-authored-by: Peach <scdzwyxst@gmail.com>

docs/guide/markdown.md

@@ -237,3 +237,66 @@ features:
     </li>
   </ul>
 </Tree>
+
+## CodeGroup <Badge>2.3.0+</Badge>
+
+需要将多代码块合并成一个分组进行展示时，可以使用 CodeGroup 语法，例如：
+
+```jsx
+/**
+ * inline: true
+ */
+import SourceCode from 'dumi/theme/builtins/SourceCode';
+const content = `
+:::code-group
+
+\`\`\`bash [npm]
+npm install -D dumi
+\`\`\`
+
+\`\`\`bash [yarn]
+yarn add -D dumi
+\`\`\`
+
+\`\`\`bash [pnpm]
+pnpm add -D dumi
+\`\`\`
+
+\`\`\`ts [.dumirc.ts] {3}
+import { defineConfig } from 'dumi';
+
+export default defineConfig({
+  // ...
+});
+\`\`\`
+:::
+`.trim();
+
+export default () => <SourceCode lang="markdown">{content}</SourceCode>;
+```
+
+将会被渲染为：
+
+:::code-group
+
+```bash [npm]
+npm install -D dumi
+```
+
+```bash [yarn]
+yarn add -D dumi
+```
+
+```bash [pnpm]
+pnpm add -D dumi
+```
+
+```ts [.dumirc.ts] {3}
+import { defineConfig } from 'dumi';
+
+export default defineConfig({
+  // ...
+});
+```
+
+:::

package.json

@@ -122,7 +122,7 @@
     "rc-tabs": "^12.10.0",
     "rc-tooltip": "^6.1.3",
     "rc-tree": "^5.7.9",
-    "rc-util": "^5.37.0",
+    "rc-util": "^5.38.0",
     "react-copy-to-clipboard": "^5.1.0",
     "react-error-boundary": "^4.0.10",
     "react-intl": "^6.4.4",