Notification 通知提醒框
Rue 现在补上了独立的 Notification 组件，不再只能借 Toast 或 Stack 手工拼通知卡片。 组件保持 Rue 自己更轻、更贴近页面内容的视觉语气，同时把通知组件 常用的执行逻辑一次覆盖：静态 open、语义快捷方法、按 key 更新、全局配置、局部 holder、六向 placement、关闭按钮、自动关闭和进度条都已经可以直接使用。
Core API
open / useNotification / config
既支持静态调用，也支持局部容器内的实例化通知流。
Placement
top / corners / bottom
六向定位和 top、bottom 偏移量保持了成熟通知系统的使用心智。
Behavior
key 更新、进度条、悬停暂停
适合异步任务、发布流程和工作台里的高频状态反馈。
何时使用
- 需要比 Toast 更完整的通知语义和更稳定的实例管理。
- 希望在事件处理函数里直接触发全局或局部通知，而不是手动维护通知数组。
- 同一条通知需要按 key 从“处理中”更新到“成功”或“失败”。
- 需要保持当前静态通知卡片示例，同时把它组织成真实可执行的组件 API。
# 通知堆叠
展示Stack 页面里的通知卡片示例，但现在直接由 Notification.Item 承载内容语义。
Latest release is live. Tap here to share the changelog.
Deploy finished successfully. Tap here to open the report.
You have 3 unread messages. Tap here to see.
# 语义类型、操作区与进度条
使用 Rue 的卡片感，但 message/title、actions/btn、progress、closable 等能力都已经补充。
All draft edits have been pushed to the shared workspace.
Two checklist items still need acknowledgement before merge.
The changelog has been published and the share card is ready.
# 六向定位
声明式容器既可以挂在页面层，也可以通过 inline 嵌进任意面板或示例盒子。
topLeft
左上角适合流程启动和任务创建类通知。
top
居中顶部适合广播类提醒。
topRight
右上角最接近常见通知中心默认位。
bottomLeft
左下角适合局部工作台里的长任务反馈。
bottom
底部居中适合跨栏提示或多列页面。
bottomRight
底部右侧适合和抽屉、检视面板搭配。
# useNotification 局部容器与按 key 更新
通过实例模式把通知约束在当前示例盒子里，方便工作台和局部面板使用。
# 静态 API
点击后会直接把通知挂到页面右上角；这条路径适合最简单的业务回调和异步流程反馈。
Global static API当前种子 0
API
Notification
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
placement | 声明式容器的定位方向，支持 top / topLeft / topRight / bottom / bottomLeft / bottomRight。 | NotificationPlacement | 'topRight' |
inline | 把容器从 fixed 改为 absolute，适合嵌进卡片、工作台或示例盒子中。 | boolean | false |
top / bottom | 控制顶部或底部偏移量，符合常见通知容器的定位方式。 | number | string | 24 |
gap | 多条通知之间的垂直间距。 | number | string | 14 |
maxWidth | 覆盖单条通知的最大宽度，适合窄侧栏或信息密度更高的场景。 | number | string | 26rem |
zIndex | 调整通知层级，避免被弹层、吸顶头部或蒙层压住。 | number | string | 70 |
Notification.Item
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
title / message | 主标题字段；保持 message 别名，同时支持更语义化的 title。 | any | - |
description | 补充说明文字，可承载多行上下文。 | any | - |
actions / btn | 底部操作区，保持 btn 别名，适合放按钮、badge 或链接。 | any | - |
type / variant | 语义类型与视觉样式，控制颜色、图标和存在感。 | 'success' | 'info' | 'warning' | 'error' / 'soft' | 'solid' | 'outline' | 'soft' |
closable / closeIcon | 是否显示关闭按钮，也支持对象形式自定义图标、标签和局部 onClose。 | boolean | NotificationClosableConfig / any | false / - |
duration / pauseOnHover | 自动关闭时长，单位秒；悬停时可暂停剩余计时。 | number | false | null / boolean | 4.5 / true |
showProgress / showIcon | 显示剩余时间进度条，或显式控制默认图标渲染。 | boolean | false / 自动判断 |
classNames / styles | 按 root、icon、title、description、actions、progress、close 粒度覆盖语义节点样式。 | object | - |
open / defaultOpen / onOpenChange / onClose | 支持受控与非受控两种显示模式，并返回 close 或 timeout 的关闭来源。 | boolean / boolean / function / function | undefined / true / - / - |
useNotification / static methods
| 属性 | 说明 | 类型 | 默认值 |
|---|---|---|---|
Notification.useNotification(options) | 返回 [api, contextHolder]，支持局部容器、默认配置、maxCount 和 key 更新。 | (options) => [NotificationInstance, any] | - |
getContainer | 默认挂到 document.body；传 false 时退回到 contextHolder 所在盒子。 | string | HTMLElement | (() => HTMLElement | ShadowRoot) | false | document.body |
open(config) | 创建或按 key 更新一条通知，返回销毁当前 key 的函数。 | (config: NotificationArgsProps) => () => void | - |
success / info / warning / error | 静态快捷方法，等价于 open({ type, ...config })。 | (config) => () => void | - |
destroy(key?) | 销毁指定 key；不传 key 时清空当前实例下所有通知。 | (key?: string | number) => void | - |
Notification.config(options) | 配置全局静态通知实例的 placement、maxCount、duration、showProgress 等默认值。 | (options: NotificationGlobalConfig) => void | - |