提示条 Alert

在页面中持续显示的提示信息。短暂的操作反馈用 Toast。

语气

examples/alert/tones.html

语气	用途	类名
信息	说明、流程提示	bg-accent text-foreground，图标 info text-brand
成功	流程完成	bg-success/8 text-foreground，图标 circle-check text-success
警告	需要注意但不阻断	bg-warning/8 text-foreground，图标 triangle-alert text-warning
错误	操作失败、表单整体错误	bg-destructive/8 text-destructive，图标 circle-alert

共用类名：flex items-start gap-3 rounded-lg px-4 py-3 text-sm。有标题时标题 font-medium，正文 text-muted-foreground。

备注与可关闭提示

examples/alert/note.html

• 备注：表单字段组下方的补充说明，bg-muted text-xs text-muted-foreground
• 可关闭：容器加 data-cb-dismissible，关闭按钮加 data-cb-dismiss。关闭前派发可取消的 cb:dismiss 事件，可以在这里记录「不再显示」

使用建议

推荐

• 标题一句话说清楚结论，正文补充原因或下一步
• 错误提示放在出错的位置附近（表单顶部或对应区块），而不是页面最顶端

避免

• 一个区块里同时出现多条提示
• 用红色提示条展示非错误信息

无障碍

• 页面加载时就存在的提示不要加 role
• 操作后动态插入的错误提示加 role="alert"，成功提示加 role="status"，读屏会立即播报

与 v2 的差异

v2 现状	规范
只有 InfoNote（灰色、12px）和对话框里的红色错误块	四种语气 + 备注，统一结构
错误块 bg-destructive/10 较重	统一为 8% 底色