Toast
toast命令式轻提示 · 自动消失 + 队列堆叠 + 手动关闭
用法
基础用法
命令式调用 toast()，页面任意处可调（需单挂一个 <ToastProvider/>）。
tsx
toast({ title: "已复制到剪贴板" });三语调
tone 提供 info / danger / neutral，驱动左边条与标题着色。
tsx
toast({ tone: "info", title: "有新版本", description: "点击刷新以更新。" });
toast({ tone: "danger", title: "保存失败", description: "网络异常，请重试。" });
toast({ title: "已复制到剪贴板" }); // neutral常驻不自动消失
timeout=0 时不自动关闭，需手动点 × 关闭。
tsx
toast({ title: "需手动关闭", description: "timeout=0，点 × 才消失。", timeout: 0 });堆叠
连续调用堆叠展示（Provider 默认限 3 条）。
tsx
toast({ tone: "info", title: "第 1 条" });
toast({ tone: "neutral", title: "第 2 条" });
toast({ tone: "danger", title: "第 3 条" });何时用
操作后命令式弹出的轻提示（已保存、已复制、保存失败），自动消失、队列堆叠（limit 3）。静态常驻的区块内提示用 Alert；横贯顶部的公告 bar 用 Banner；需要展开操作/富内容的通知用 Notification。ToastProvider 在应用/段落 layout 单挂一次，业务侧只调 toast()。
导入
ts
import { toast, ToastProvider } from "@hulianui/ui"Props
toast(options) 的 ToastOptions：
| 名称 | 类型 | 默认 | 说明 |
|---|---|---|---|
| tone | "info"｜"danger"｜"neutral" | "neutral" | 语调，驱动左边条 + 标题着色（复用 Alert 语义，无 success：token 无） |
| timeout | number | 5000 | 自动消失毫秒数；0 = 不自动消失（手动关闭）；缺省取 Provider 默认 |
Slots
toast(options) 的 ToastOptions：
| 插槽 | 类型 | 说明 |
|---|---|---|
| title | ReactNode | 标题（加粗主行） |
| description | ReactNode | 描述（次行，恒 text-muted） |
ToastProvider 在根/段落 layout 单挂，承接命令式渲染。
禁忌 / 坑
ToastProvider全应用只挂一次（在段落 layout），别在 showcase/页面里重复挂，否则命令式渲染会重复。- 无
success语调（token 无），成功态用info或neutral。 - 测试该组件时注意 Base UI Toast 的几个坑见 [[base-ui-toast-close-aria-hidden-query-dom-not-role]]：未聚焦的 Close 按钮带
aria-hidden致getByRole("button")找不到（改查 DOM）、aria-live 公告会让标题文本重复匹配、全局 manager 持久化致 toast 跨测试泄漏需清理。
相关
Alert · Banner · Notification · ServiceMessage · Result · GiftFeed
Playground
toast({
tone: "neutral",
title: "已保存",
description: "更改已成功同步。",
timeout: 5000,
})