Alert 警告

Alert 用于向用户传达重要状态、操作结果与系统提醒。

组件保持了 Rue 当前的 alert、语义色、soft、outline、dash 与响应式组合方式，同时提供了 type、color、title、description、icon、action、closable、banner 等常用能力。

# 基础用法

展示基础组合式写法：你仍然可以手动放入图标、文本与任意自定义内容。

12 unread messages. Tap to see.

融合基础的 Info、Success、Warning、ErrorDemo，同时展示 variant、color、type 三种入口。

New software update available.

Your purchase has been confirmed!

Warning: Invalid email address!

Error! Task failed successfully.

展示 soft、outline、dash 三组示例，但按语义化的 API 一次性整理成一个区块。

Soft

12 unread messages. Tap to see.

Your purchase has been confirmed!

Warning: Invalid email address!

Error! Task failed successfully.

Outline

12 unread messages. Tap to see.

Your purchase has been confirmed!

Warning: Invalid email address!

Error! Task failed successfully.

Dash

12 unread messages. Tap to see.

Your purchase has been confirmed!

Warning: Invalid email address!

Error! Task failed successfully.

展示按钮 + 响应式布局示例，同时把操作区收敛到 action API。

we use cookies for no reason.

把手写的标题描述示例组织为 title 和 description API，同时保持右侧动作按钮。

New message!

closable、closeText、afterClose 适合一次性通知、操作反馈和可忽略提醒。

Invite sent

Your billing settings have been saved.

banner、showIcon 与 icon API 适合系统级公告与品牌化通知。

Scheduled maintenance

Workspace protected

当前 Alert 同时支持 Rue 基础用法与常见业务组件心智，下面列出当前建议使用的核心属性。

属性	说明	类型	默认值
`action`	右侧操作区，可放按钮或链接	`any`	`-`
`afterClose`	关闭完成后触发	`() => void`	`-`
`banner`	横幅模式，默认回退为 warning 语义	`boolean`	`false`
`children`	自定义内容插槽，展示基础组合式写法	`any`	`-`
`className`	追加自定义类名	`string`	`-`
`closable`	显示关闭按钮	`boolean`	`false`
`closeIcon`	自定义关闭按钮内容	`any`	`-`
`closeText`	以文本替代默认关闭图标	`any`	`-`
`color`	Rue 风格语义色别名，支持当前示例	`'default' \| 'info' \| 'success' \| 'warning' \| 'error'`	`-`
`dash`	虚线边框样式	`boolean`	`false`
`description`	辅助说明文案	`any`	`-`
`direction`	内容排布方向	`'vertical' \| 'horizontal'`	`-`
`icon`	自定义图标	`any`	`-`
`message`	标题别名，支持常见业务组件里的 message 写法	`any`	`-`
`onClose`	点击关闭按钮时触发	`(event: MouseEvent) => void`	`-`
`outline`	描边样式	`boolean`	`false`
`role`	可访问性角色属性	`string`	`alert`
`showIcon`	显式控制图标显示	`boolean`	`标题/描述或 banner 场景自动显示`
`soft`	柔和填充样式	`boolean`	`false`
`title`	主标题文案	`any`	`-`
`type`	常见业务组件风格的语义类型	`'info' \| 'success' \| 'warning' \| 'error'`	`-`
`variant`	使用 Rue 基础语义类型写法	`'info' \| 'success' \| 'warning' \| 'error'`	`-`