跳到主要内容

Toast 新增单条 closeButton prop

版本： 0.2.0 · 类型： ✨ 新功能

问题​

关闭按钮是否显示此前只能由 Toaster 容器级 closeButton + 形态推断（仅 Alert / 带按钮 / aiFeedback 才显示）隐式决定，单条 toast 无法显式控制。同时 Toast.config.test.tsx 的「默认显示关闭按钮」用例用的是普通 success Message，与形态规则冲突导致测试失败。

改动文件​

  • packages/design/src/components/Toast/toast-manager.ts
  • packages/design/src/components/Toast/ToastItem.tsx
  • packages/design/src/components/Toast/Toast.tsx
  • packages/design/src/components/Toast/Toast.config.test.tsx
  • packages/design-site/docs/components/patterns/feedbacks-toast.mdx（英文）
  • packages/design-site/i18n/zh-CN/docusaurus-plugin-content-docs/current/components/patterns/feedbacks-toast.mdx（中文）

改动内容​

  • ToastOptions / ToastRecord 新增可选 closeButton?: boolean，create 透传到 record
  • ToastItem 关闭按钮判定改为 showClose = toast.closeButton ?? (closeButton && (isAlert || hasActions || aiFeedback))：单条 toast 显式设置时完全覆盖容器开关与形态推断（true 任何形态都显示、false 任何形态都隐藏），不传时回落到原容器 + 形态规则
  • Toast.tsx JSDoc 补充 closeButton 用法与 toast('msg', { closeButton: true }) 示例
  • 修正 config 测试：默认 / 容器隐藏用例改用 Alert 形态（带 description）真实命中形态规则；新增「普通 Message 默认无关闭按钮」「closeButton=true 强制显示」「closeButton=false 强制隐藏」三个覆盖用例
  • design-site 文档（中英双语）同步：toast functions 表补充 closeButton: true/false / aiFeedback / loading / id 复用等行；Toaster props 表补全真实自研 API（duration / visibleToasts / style）；清理「基于 Sonner 封装 / toast.custom() / toastOptions.classNames」等历史遗留描述（组件早已迁到自研 toast manager）

备注​

（Linear）