add note and alert guidance to contributor docs (#3989)

* added guidance on alert and note components

* added note about alert levels

* Apply suggestions from code review

Co-authored-by: Fiona <[email protected]>

Co-authored-by: Fiona <[email protected]>

Author: imatwawana

src/docs/contributing/pages/components.mdx

@@ -7,14 +7,14 @@ noindex: true
 
 Render an alert callout.
 
-<Alert level="info" title="Note">
+<Alert level="info" title="Important">
 
 This is an alert
 
 </Alert>
 
 ```markdown {tabTitle:Example}
-<Alert level="info" title="Note">
+<Alert level="info" title="Important">
 
 This is an alert
 
@@ -27,7 +27,16 @@ Attributes:
 - `level` (string)
 - `dismiss` (boolean)
 
-See also the Note component.
+Use this for these types of content:
+
+- **Important:** 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.
+  - Use this with or without a title
+- **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.
+  - Use with the title "Important"; do not use the title "Warning"
+
+An Alert component with no level setting will render as a Note component.
+
+See also the [Note component](#note).
 
 ## ConfigKey
 
@@ -99,8 +108,14 @@ Something important, but maybe not _that_ important.
 </Note>
 ```
 
+Use this for these types of content:
+
+- **Prerequisite(s):** Use these to list things that are required to finish. Place them prior to the procedure/process that follows so a user doesn't start and stop.
+- **Note:** to document information that's relevant to the topic, but isn't part of the larger point of the content. This might include a piece of information that should be highlighted, but isn't necessarily more important than other information. These include calling out early adopter features or providing clarification. Use sparingly.
 See also the [Alert component](#alert).
 
+Don't use a title with this type of note.
+
 ## PageGrid
 
 Render all child pages of this document, including their `description` if available.