From f474b7251ab16e805af07bd8b336fd30d1b3d6b1 Mon Sep 17 00:00:00 2001
From: tianhao <tianhao@metona.dev>
Date: Tue, 16 Jun 2026 13:52:18 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20demo=E9=A1=B5=E5=88=A0=E9=99=A4=E9=9D=9E?=
 =?UTF-8?q?=E8=A7=84=E5=AE=9A=E7=9A=84M=E5=88=AB=E5=90=8D=EF=BC=8C?=
 =?UTF-8?q?=E7=BB=9F=E4=B8=80=E4=BD=BF=E7=94=A8MeToast?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 site/demo.html | 92 +++++++++++++++++++++++++-------------------------
 1 file changed, 46 insertions(+), 46 deletions(-)

diff --git a/site/demo.html b/site/demo.html
index 2c7622d..fe02514 100644
--- a/site/demo.html
+++ b/site/demo.html
@@ -70,19 +70,19 @@
   <div class="card">
     <div class="label">📢 基础通知</div>
     <div class="btn-row">
-      <button class="btn c-s" onclick="M.success('操作成功！')">✓ 成功</button>
-      <button class="btn c-e" onclick="M.error('操作失败！')">✕ 错误</button>
-      <button class="btn c-w" onclick="M.warning('请注意检查')">⚠ 警告</button>
-      <button class="btn c-i" onclick="M.info('系统维护中')">ℹ 信息</button>
-      <button class="btn c-sl" onclick="M.show('默认消息')">— 默认</button>
+      <button class="btn c-s" onclick="MeToast.success('操作成功！')">✓ 成功</button>
+      <button class="btn c-e" onclick="MeToast.error('操作失败！')">✕ 错误</button>
+      <button class="btn c-w" onclick="MeToast.warning('请注意检查')">⚠ 警告</button>
+      <button class="btn c-i" onclick="MeToast.info('系统维护中')">ℹ 信息</button>
+      <button class="btn c-sl" onclick="MeToast.show('默认消息')">— 默认</button>
     </div>
     <div class="demo-section">
       <div class="btn-row">
-        <button class="btn btn-outline btn-sm" onclick="M.success({title:'保存成功',message:'文件已同步到云端'})">带标题</button>
-        <button class="btn btn-outline btn-sm" onclick="M.info('显示10秒',{duration:10000})">长时10s</button>
-        <button class="btn btn-outline btn-sm" onclick="M.info('手动关闭',{duration:0})">手动关闭</button>
-        <button class="btn btn-outline btn-sm" onclick="M.info('隐藏图标',{icon:false})">无图标</button>
-        <button class="btn btn-outline btn-sm" onclick="M.info('隐藏进度条',{showProgress:false})">无进度条</button>
+        <button class="btn btn-outline btn-sm" onclick="MeToast.success({title:'保存成功',message:'文件已同步到云端'})">带标题</button>
+        <button class="btn btn-outline btn-sm" onclick="MeToast.info('显示10秒',{duration:10000})">长时10s</button>
+        <button class="btn btn-outline btn-sm" onclick="MeToast.info('手动关闭',{duration:0})">手动关闭</button>
+        <button class="btn btn-outline btn-sm" onclick="MeToast.info('隐藏图标',{icon:false})">无图标</button>
+        <button class="btn btn-outline btn-sm" onclick="MeToast.info('隐藏进度条',{showProgress:false})">无进度条</button>
       </div>
     </div>
   </div>
@@ -133,7 +133,7 @@
     <div class="btn-row">
       <button class="btn c-p" onclick="demoGroup()">创建分组</button>
       <button class="btn c-e" onclick="dismissGroup()">关闭分组</button>
-      <button class="btn btn-outline btn-sm" onclick="M.info('分组数量: '+group.count())">查看数量</button>
+      <button class="btn btn-outline btn-sm" onclick="MeToast.info('分组数量: '+group.count())">查看数量</button>
     </div>
   </div>
 
@@ -159,12 +159,12 @@
   <div class="card">
     <div class="label">📍 位置</div>
     <div class="btn-row">
-      <button class="btn c-sl" onclick="M.success('左上角',{position:'top-left'})">↖ top-left</button>
-      <button class="btn c-sl" onclick="M.success('顶部居中',{position:'top-center'})">↑ top-center</button>
-      <button class="btn c-sl" onclick="M.success('右上角',{position:'top-right'})">↗ top-right</button>
-      <button class="btn c-sl" onclick="M.success('左下角',{position:'bottom-left'})">↙ bottom-left</button>
-      <button class="btn c-sl" onclick="M.success('底部居中',{position:'bottom-center'})">↓ bottom-center</button>
-      <button class="btn c-sl" onclick="M.success('右下角',{position:'bottom-right'})">↘ bottom-right</button>
+      <button class="btn c-sl" onclick="MeToast.success('左上角',{position:'top-left'})">↖ top-left</button>
+      <button class="btn c-sl" onclick="MeToast.success('顶部居中',{position:'top-center'})">↑ top-center</button>
+      <button class="btn c-sl" onclick="MeToast.success('右上角',{position:'top-right'})">↗ top-right</button>
+      <button class="btn c-sl" onclick="MeToast.success('左下角',{position:'bottom-left'})">↙ bottom-left</button>
+      <button class="btn c-sl" onclick="MeToast.success('底部居中',{position:'bottom-center'})">↓ bottom-center</button>
+      <button class="btn c-sl" onclick="MeToast.success('右下角',{position:'bottom-right'})">↘ bottom-right</button>
     </div>
   </div>
 
@@ -183,9 +183,9 @@
   <div class="card">
     <div class="label">🔌 插件</div>
     <div class="btn-row">
-      <button class="btn c-p" onclick="M.use('keyboard');M.info('已安装 — 试试按 ESC 键','keyboard插件')">keyboard ESC关闭</button>
-      <button class="btn c-i" onclick="M.use('persistence');M.info('已安装 — 配置将自动保存','persistence插件')">persistence 持久化</button>
-      <button class="btn c-t" onclick="M.use('accessibility');M.info('已安装 — 屏幕阅读器可用','accessibility插件')">accessibility 无障碍</button>
+      <button class="btn c-p" onclick="MeToast.use('keyboard');MeToast.info('已安装 — 试试按 ESC 键','keyboard插件')">keyboard ESC关闭</button>
+      <button class="btn c-i" onclick="MeToast.use('persistence');MeToast.info('已安装 — 配置将自动保存','persistence插件')">persistence 持久化</button>
+      <button class="btn c-t" onclick="MeToast.use('accessibility');MeToast.info('已安装 — 屏幕阅读器可用','accessibility插件')">accessibility 无障碍</button>
     </div>
   </div>
 
@@ -193,12 +193,12 @@
   <div class="card">
     <div class="label">🔧 Toast 管理</div>
     <div class="btn-row">
-      <button class="btn c-s" onclick="M.success('消息 '+(M.count()+1))">发一条</button>
-      <button class="btn c-i" onclick="M.info('消息 '+(M.count()+1))">再发一条</button>
-      <button class="btn c-w" onclick="M.info('当前共 '+M.count()+' 条消息')">查看数量</button>
-      <button class="btn c-e" onclick="M.dismiss()">关闭全部</button>
-      <button class="btn c-sl" onclick="M.pauseAll();M.info('已暂停全部计时')">暂停全部</button>
-      <button class="btn c-sl" onclick="M.resumeAll();M.info('已恢复全部计时')">恢复全部</button>
+      <button class="btn c-s" onclick="MeToast.success('消息 '+(MeToast.count()+1))">发一条</button>
+      <button class="btn c-i" onclick="MeToast.info('消息 '+(MeToast.count()+1))">再发一条</button>
+      <button class="btn c-w" onclick="MeToast.info('当前共 '+MeToast.count()+' 条消息')">查看数量</button>
+      <button class="btn c-e" onclick="MeToast.dismiss()">关闭全部</button>
+      <button class="btn c-sl" onclick="MeToast.pauseAll();MeToast.info('已暂停全部计时')">暂停全部</button>
+      <button class="btn c-sl" onclick="MeToast.resumeAll();MeToast.info('已恢复全部计时')">恢复全部</button>
     </div>
   </div>
 
@@ -210,50 +210,50 @@
 
 <script src="../dist/metona-toast.js"></script>
 <script>
-  const M = MeToast;
-  M.configure({ position:'top-right', duration:4000, theme:'dark', animation:'slide', pauseOnHover:true, showProgress:true });
+  
+  MeToast.configure({ position:'top-right', duration:4000, theme:'dark', animation:'slide', pauseOnHover:true, showProgress:true });
 
   // Loading
-  function demoLoading() { const l=M.loading('正在提交...'); setTimeout(()=>l.success('提交成功！'),2000); }
-  function demoLoadingFail() { const l=M.loading('正在提交...'); setTimeout(()=>l.error('提交失败，请重试'),2000); }
+  function demoLoading() { const l=MeToast.loading('正在提交...'); setTimeout(()=>l.success('提交成功！'),2000); }
+  function demoLoadingFail() { const l=MeToast.loading('正在提交...'); setTimeout(()=>l.error('提交失败，请重试'),2000); }
   async function demoPromise() {
     const p=new Promise((r,e)=>setTimeout(()=>Math.random()>0.3?r('ok'):e('fail'),2000));
-    try{await M.promise(p,{loading:'处理中...',success:'成功！',error:'失败'});}catch(_){}
+    try{await MeToast.promise(p,{loading:'处理中...',success:'成功！',error:'失败'});}catch(_){}
   }
 
   // 对话框
-  async function demoConfirm() { const ok=await M.confirm('确定删除吗？',{confirmText:'删除',confirmColor:'#ef4444'}); if(ok)M.success('已删除'); else M.info('已取消'); }
-  async function demoPrompt() { const v=await M.prompt('请输入姓名',{placeholder:'请输入...'}); if(v) M.info('你好，'+v+'！'); }
+  async function demoConfirm() { const ok=await MeToast.confirm('确定删除吗？',{confirmText:'删除',confirmColor:'#ef4444'}); if(ok)MeToast.success('已删除'); else MeToast.info('已取消'); }
+  async function demoPrompt() { const v=await MeToast.prompt('请输入姓名',{placeholder:'请输入...'}); if(v) MeToast.info('你好，'+v+'！'); }
 
   // 进度 & 队列
-  function demoProgress() { const p=M.progress('上传中...'); let v=0; const t=setInterval(()=>{v+=Math.random()*28; if(v>=100){clearInterval(t);p.complete('完成！');}else p.setProgress(v);},400); }
-  function demoCountdown() { M.countdown('{seconds} 秒后执行',5,{onComplete:()=>M.success('已执行')}); }
-  async function demoQueue() { await M.queue(['步骤一','步骤二','步骤三'],{delay:800,duration:2000,type:'info'}); }
-  function demoStack() { M.stack(['消息1','消息2','消息3','消息4'],{stagger:150,type:'info'}); }
+  function demoProgress() { const p=MeToast.progress('上传中...'); let v=0; const t=setInterval(()=>{v+=Math.random()*28; if(v>=100){clearInterval(t);p.complete('完成！');}else p.setProgress(v);},400); }
+  function demoCountdown() { MeToast.countdown('{seconds} 秒后执行',5,{onComplete:()=>MeToast.success('已执行')}); }
+  async function demoQueue() { await MeToast.queue(['步骤一','步骤二','步骤三'],{delay:800,duration:2000,type:'info'}); }
+  function demoStack() { MeToast.stack(['消息1','消息2','消息3','消息4'],{stagger:150,type:'info'}); }
 
   // Action
   function demoActionDelete() {
     let deleted=true;
-    M.action('文件 data.json 已删除',[{text:'撤销',onClick:()=>{deleted=false;M.success('已撤销删除');},color:'#3b82f6'}]);
+    MeToast.action('文件 data.json 已删除',[{text:'撤销',onClick:()=>{deleted=false;MeToast.success('已撤销删除');},color:'#3b82f6'}]);
   }
   function demoActionMulti() {
-    M.action('邮件已发送',[
-      {text:'查看',onClick:()=>M.info('打开邮件详情'),color:'#3b82f6'},
-      {text:'撤回',onClick:()=>M.warning('邮件已撤回'),color:'#f59e0b'},
+    MeToast.action('邮件已发送',[
+      {text:'查看',onClick:()=>MeToast.info('打开邮件详情'),color:'#3b82f6'},
+      {text:'撤回',onClick:()=>MeToast.warning('邮件已撤回'),color:'#f59e0b'},
     ]);
   }
   function demoActionSuccess() {
-    M.action('上传完成',[{text:'查看文件',onClick:()=>M.info('打开文件管理器'),color:'#10b981'}]);
+    MeToast.action('上传完成',[{text:'查看文件',onClick:()=>MeToast.info('打开文件管理器'),color:'#10b981'}]);
   }
 
   // 分组
-  const group = M.group('demo-group');
+  const group = MeToast.group('demo-group');
   function demoGroup() { group.success('分组消息 #'+(group.count()+1)); group.info('分组消息 #'+(group.count()+1)); }
-  function dismissGroup() { M.dismissGroup('demo-group'); M.info('已关闭 demo-group 分组'); }
+  function dismissGroup() { MeToast.dismissGroup('demo-group'); MeToast.info('已关闭 demo-group 分组'); }
 
   // 动画
-  function anim(name) { M.success('动画: '+name,{animation:name,duration:3000}); }
-  function switchTheme(t) { M.themes.switchTheme(t); M.configure({theme:t}); const n={light:'浅色',dark:'深色',auto:'自动',warm:'暖色'}; M.info('主题: '+n[t],{theme:t}); }
+  function anim(name) { MeToast.success('动画: '+name,{animation:name,duration:3000}); }
+  function switchTheme(t) { MeToast.themes.switchTheme(t); MeToast.configure({theme:t}); const n={light:'浅色',dark:'深色',auto:'自动',warm:'暖色'}; MeToast.info('主题: '+n[t],{theme:t}); }
 </script>
 </body>
 </html>