+
+API 文档
+MetonaToast v2.0.0 完整 API 参考。所有方法均支持链式调用和配置覆盖。
+
+
+show(message, opts?)
+显示默认类型的 Toast 通知。
+// 字符串
+MeToast.show('默认消息');
+
+// 带配置
+MeToast.show('自定义', { duration: 2000, position: 'bottom-center' });
+
+// 对象形式
+MeToast.show({ title: '标题', message: '内容' });
+
+success(message, opts?)
+显示成功通知。绿色对勾图标。
+MeToast.success('保存成功！');
+MeToast.success({ title: '已保存', message: '文件已同步到云端' });
+
+error(message, opts?)
+显示错误通知。红色叉号图标。
+MeToast.error('网络错误，请重试');
+
+warning(message, opts?)
+显示警告通知。黄色三角图标。
+MeToast.warning('请注意检查输入内容');
+
+info(message, opts?)
+显示信息通知。蓝色圆形图标。
+MeToast.info('系统将于 22:00 进行维护');
+
+loading(message, opts?)
+显示加载状态。返回一个控制对象，支持链式转换为 success/error/info/warning。
+const loading = MeToast.loading('正在提交...');
+setTimeout(() => loading.success('提交成功！'), 2000);
+
+// 返回对象方法
+loading.success(msg, opts?) // 转为成功
+loading.error(msg, opts?) // 转为错误
+loading.info(msg, opts?) // 转为信息
+loading.warning(msg, opts?) // 转为警告
+loading.update(partial) // 原地更新
+loading.dismiss() // 关闭
+
+
+promise(promise, opts)
+自动根据 Promise 状态切换 Toast。显示 loading → 自动 success/error。
+await MeToast.promise(
+ fetch('/api/data'),
+ {
+ loading: '加载中...',
+ success: '加载完成！',
+ error: '加载失败',
+ }
+);
+
+| 参数 | 类型 | 说明 |
|---|
+| promise | Promise | 要监听的 Promise 对象 |
+| opts.loading | string | 加载中文本 |
+| opts.success | string | 成功时文本 |
+| opts.error | string | 失败时文本 |
+
+
+confirm(message, opts?)
+确认对话框。返回 Promise<boolean>，用户点击确认返回 true。
+const ok = await MeToast.confirm('确定删除吗？', {
+ confirmText: '删除',
+ confirmColor: '#ef4444',
+ cancelText: '取消',
+});
+if (ok) MeToast.success('已删除');
+
+prompt(message, opts?)
+输入对话框。返回 Promise<string|null>，用户取消返回 null。
+const name = await MeToast.prompt('请输入姓名', {
+ placeholder: '请输入...',
+ defaultValue: '张三',
+});
+if (name) MeToast.info('你好，' + name + '！');
+
+progress(message, opts?)
+进度条通知。返回控制对象，可调用 setProgress / complete / error。
+const p = MeToast.progress('上传中...');
+p.setProgress(30);
+p.setProgress(70);
+p.complete('上传完成！');
+// 或
+p.error('上传失败');
+p.dismiss();
+
+countdown(message, seconds, opts?)
+倒计时 Toast。{seconds} 占位符自动替换为剩余秒数。
+MeToast.countdown('操作将在 {seconds} 秒后执行', 5, {
+ onComplete: () => MeToast.success('已执行'),
+});
+
+// 返回控制对象
+const c = MeToast.countdown('{seconds}s', 10);
+c.cancel(); // 取消并关闭
+c.pause(); // 暂停
+c.resume(); // 恢复
+
+queue(messages, opts?)
+队列展示：顺序逐个显示消息。返回可取消的 thenable 对象。
+const q = MeToast.queue(['步骤一', '步骤二', '步骤三'], {
+ delay: 800,
+ duration: 2000,
+ type: 'info',
+});
+q.cancel(); // 取消队列
+await q; // 等待队列完成
+
+stack(messages, opts?)
+堆叠展示：同时错峰显示多条消息。
+MeToast.stack(['消息1', '消息2', '消息3', '消息4'], {
+ stagger: 150,
+ type: 'info',
+});
+
+action(message, actions, opts?) v2.0
+Action Toast：内嵌操作按钮的通知。类似 Android Snackbar。
+MeToast.action('文件已删除', [
+ { text: '撤销', onClick: () => restore(), color: '#3b82f6' },
+ { text: '查看', onClick: () => openFile() },
+]);
+
+| 按钮字段 | 类型 | 说明 |
|---|
+| text | string | 按钮文本 |
+| onClick | function | 点击回调，参数为 toast 实例 |
+| color | string | 按钮背景色，默认 #6366f1 |
+| close | boolean | 点击后是否关闭 toast，默认 true |
+
+
+
+group(name) v2.0
+创建 Toast 分组。返回一个自动添加 group 参数的子对象，支持按组管理。
+const orders = MeToast.group('orders');
+orders.success('订单已创建');
+orders.error('支付失败');
+orders.count(); // 该组的 toast 数量
+orders.dismiss(); // 关闭整组
+
+// 也可通过主对象关闭
+MeToast.dismissGroup('orders');
+
+dismiss(id?)
+关闭 Toast。无参数关闭所有，传 id 关闭指定。
+MeToast.dismiss(); // 关闭所有
+MeToast.dismiss(toastId); // 关闭指定
+其他管理方法：count() getToasts() pauseAll() resumeAll() destroy() clear()
+
+
+全局配置。影响后续所有 Toast。
+MeToast.configure({
+ position: 'top-right',
+ duration: 4000,
+ theme: 'dark',
+ animation: 'slide',
+ locale: 'zh-CN',
+});
+
+use(plugin)
+安装插件。支持字符串（预设）和对象（自定义）。
+MeToast.use('keyboard'); // ESC 关闭所有 Toast
+MeToast.use('persistence'); // 配置持久化到 localStorage
+MeToast.use('accessibility'); // 屏幕阅读器朗读
+
+// 自定义插件
+MeToast.use({
+ name: 'my-plugin',
+ install() {
+ Toast.on('afterShow', (t) => console.log(t.message));
+ },
+});
+
+destroy()
+完全销毁：关闭所有 Toast、移除 DOM 容器和样式标签。
+MeToast.destroy();
+
+
+全部配置项
+以下配置可用于 configure() 或单个 Toast 的第二个参数。
+
+| 配置项 | 类型 | 默认值 | 说明 |
|---|
+| position | string | 'top-right' | 位置：top-left/center/right、bottom-left/center/right |
+| duration | number | 4000 | 显示时长(ms)，0=不自动关闭 |
+| max | number | 6 | 同时最多显示条数 |
+| gap | number | 12 | Toast 之间的间距(px) |
+| offset | number | 24 | 容器边距(px) |
+| pauseOnHover | boolean | true | 悬停时暂停计时 |
+| closeOnClick | boolean | true | 点击 Toast 关闭 |
+| draggable | boolean | true | 允许拖拽关闭 |
+| showProgress | boolean | true | 显示进度条 |
+| progressDirection | string | 'horizontal' | 进度条方向：horizontal / vertical |
+| icon | boolean | true | 显示类型图标 |
+| closeButton | boolean | true | 显示关闭按钮 |
+| theme | string | 'auto' | 主题：light / dark / auto / warm |
+| animation | string | 'slide' | 动画效果（见下方列表） |
+| zIndex | number | 9999 | CSS z-index |
+| width | number/string | 360 | Toast 宽度(px) |
+| className | string | '' | 附加 CSS 类名 |
+| style | object | {} | 内联样式对象 |
+| locale | string | 'zh-CN' | 语言代码 |
+| resetTimerOnUpdate | boolean | false | update()时重置计时器 v2.0 |
+| notifyWhenHidden | boolean | false | 页面不可见时发系统通知 v2.0 |
+| render | function | — | 自定义渲染函数 v2.0 |
+
+
+回调函数
+
+| 回调 | 签名 | 触发时机 |
|---|
+| onShow | (toast) => void | Toast 显示后 |
+| onClose | (toast) => void | Toast 关闭后 |
+| onClick | (toast) => void | Toast 被点击时 |
+| onUpdate | (toast) => void | Toast 内容更新后 v2.0 |
+
+
+动画列表
+
+| 名称 | 效果 | 时长 |
|---|
+| slide | 从右侧滑入 + 回弹 | 400ms |
+| fade | 纯淡入 (blur→清晰) | 500ms |
+| scale | 弹性放大 (0.55→1.07→1) | 450ms |
+| bounce | 从天而降四段弹跳 | 650ms |
+| flip | 3D 翻转入场 + 回摆 | 500ms |
+| rotate | 旋转摇摆进入 | 500ms |
+| zoom | 从中心爆发式弹出 | 500ms |
+| slideUp | 从下方弹入 | 400ms |
+| slideDown | 从上方弹入 | 400ms |
+| slideLeft | 从左侧滑入 | 400ms |
+| slideRight | 从右侧滑入 | 400ms |
+
+
+主题参考
+// 内置主题
+light — 白色玻璃质感
+dark — 深色玻璃质感
+auto — 跟随系统
+warm — 暖色调
+
+// 注册自定义主题
+MeToast.themes.registerTheme('ocean', {
+ bg: 'rgba(240,249,255,0.96)',
+ text: '#0c4a6e',
+ border: 'rgba(14,165,233,0.2)',
+ shadow: '0 10px 36px -10px rgba(14,165,233,0.18)',
+ hoverShadow: '0 14px 48px -10px rgba(14,165,233,0.22)',
+ progressBg: 'rgba(14,165,233,0.1)',
+ closeHoverBg: 'rgba(14,165,233,0.1)',
+});
+MeToast.themes.switchTheme('ocean');
+
+
+
+
+
+
+
diff --git a/site/index.html b/site/index.html
new file mode 100644
index 0000000..1e7a5d0
--- /dev/null
+++ b/site/index.html
@@ -0,0 +1,222 @@
+
+
+
+