Skip to content

Commit 8f29ffa

Browse files
committed
better example
1 parent c0cbf40 commit 8f29ffa

File tree

1 file changed

+34
-6
lines changed

1 file changed

+34
-6
lines changed

docs/contributing/pages/components.mdx

Lines changed: 34 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,41 @@ sidebar_order: 40
88

99
Render an alert callout.
1010

11-
<Alert title="Important">
12-
This is an alert
11+
<Alert title="Watch out!">
12+
This is an info alert. Use these for information that's critical to know; it's important for users to read, but won't cause a catastrophic problem if they don't read it. These include versions that introduce breaking changes or feature limitations. Use infrequently.
1313
</Alert>
1414

15-
```markdown {tabTitle:Example}
16-
<Alert title="Important">
17-
This is an alert
15+
<Alert level="warning" title="Important">
16+
This is a warning alert. Use these for items that MUST be well understood before proceeding. These highlight information that could cause users to make catastrophic errors that break their applications in ways that are very difficult to fix or create liabilities for them, such as information needed to avoid leaking PII. These should be used very rarely.
17+
</Alert>
18+
19+
<Alert>
20+
This is an alert without title.
21+
</Alert>
22+
23+
<Alert title="List">
24+
<ul>
25+
<li>Item 1</li>
26+
<li>Item 2</li>
27+
</ul>
28+
</Alert>
29+
30+
31+
```markdown {tabTitle:Info}
32+
<Alert title="Watch out!">
33+
This is an info alert.
34+
</Alert>
35+
```
36+
37+
```markdown {tabTitle:Warning}
38+
<Alert level="warning" title="Important">
39+
This is a warning alert.
40+
</Alert>
41+
```
42+
43+
```markdown {tabTitle:No Title}
44+
<Alert>
45+
This is an alert without title.
1846
</Alert>
1947
```
2048

@@ -30,7 +58,7 @@ Use this for these types of content:
3058
- **Warning:** Use these for items that MUST be well understood before proceeding. These highlight information that could cause users to make catastrophic errors that break their applications in ways that are very difficult to fix or create liabilities for them, such as information needed to avoid leaking PII. These should be used very rarely.
3159
- Use with the title "Important"; do not use the title "Warning"
3260

33-
An Alert component with no level setting will render as a Note component.
61+
You can also omit the title of the alert.
3462

3563
See also the [Note component](#note).
3664

0 commit comments

Comments
 (0)