警告就绪 Storybook
警告是一种用于向用户显示重要消息或通知的基本元素。
何时使用
使用警告来告知用户更新、更改或问题。向用户提供反馈、让他们知情并最大程度地减少中断非常重要。警告有两种不同的用例：任务生成和系统生成。
用法
任务生成
任务生成的警告是根据用户的行为触发的，并提供快速、直接的反馈。此类警告应放置在用户正在积极工作的区域附近。
系统生成
系统生成的警告是由系统触发的，与用户的操作无关。使用这些警告来解释系统状态或发生在其他地方的其他事件。
实现 / 选项
内容
标题
警告中的标题始终是必需的。它们应该简洁、以人为本且不含术语，以便用户轻松理解。
描述
描述文本是可选的，应谨慎使用。保持描述文本简短，重点说明警告的原因，并包含可能的解决方案或前进路径，以防止用户被阻止。
内容指南（如何编写）
在编写警告消息时，始终使用简单明了的语言非常重要。避免在警告内容中使用术语或系统错误。为用户提供前进路径或可能的解决方案。有关编写的更多建议，请查看用户体验文案指南。
严重程度
警告可以有四 (4) 种不同的消息类型
- 信息 - 向用户提供信息，不中断任何当前操作
- 成功 - 当任何操作成功时，会在任务按预期完成时确认
- 警告 - 告知用户某个操作是不受欢迎的
- 错误 - 当操作未按预期发生时，通常是出现故障，并且期望用户采取行动
行动呼吁
警告（特别是行内警告）可以包含行动呼吁（CTA），尤其是在用户可以采取行动补救或纠正显示警告的原因时。在警告中提供 CTA 时，请务必使标签简洁明了，确保用户可以采取的操作清晰，并尽量保持标签简短（最多几个字）。请参阅 Grafana 的用户体验文案指南。
类型和行为
Grafana 通过两种方式使用警告：行内警告和浮动通知。这两种不同类型的警告具有不同的目的和行为。理解这些差异以确保您使用正确的类型非常重要。
行内警告
行内警告通知用户系统和用户触发的事件。它们出现在主要内容区域的顶部或底部，靠近用户正在积极工作的区域。这有助于保持上下文并支持理解。这些消息是任务生成的，提供直接、上下文相关的反馈。
加载中...
实时编辑器
<Alert title="Inline alert"> <div>Child content that includes some alert details, like maybe what actually happened.</div> </Alert>
浮动通知
浮动通知是用于显示简短消息的临时窗口元素；它们出现在屏幕的右上角，可以通过单击X关闭，或者在几秒钟后自动消失
加载中...
实时编辑器
<Alert title="Toast" elevated> <div>Child content that includes some alert details, like maybe what actually happened.</div> </Alert>
行为
- 浮动通知显示一小段时间
- 包含关闭
X操作，用户可以关闭警告 - 如果同时显示多个，最新的警告始终显示在顶部。较旧的浮动通知按顺序堆叠在最新的警告下方。