You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: components/code-groups.mdx
+4-8Lines changed: 4 additions & 8 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,12 +1,10 @@
1
1
---
2
2
title: "Code groups"
3
-
description: "The CodeGroup component lets you combine code blocks in a display separated by tabs"
3
+
description: "Display multiple code examples in a tabbed interface"
4
4
icon: "group"
5
5
---
6
6
7
-
You will need to make [Code Blocks](/code) then add the `<CodeGroup>` component around them. Every Code Block must have a filename because we use the names for the tab buttons.
8
-
9
-
See below for an example of the end result.
7
+
Use the `CodeGroup` component to display multiple code blocks in a tabbed interface, making it easy for users to compare implementations across different programming languages or see alternative approaches to the same task.
10
8
11
9
<CodeGroup>
12
10
@@ -28,9 +26,9 @@ class HelloWorld {
28
26
29
27
</CodeGroup>
30
28
31
-
<RequestExample>
29
+
To create a code group, wrap multiple code blocks with `<CodeGroup>` tags. Each code block must include filename, which becomes the tab label.
0 commit comments