‏gooey-toast: توست‌های ری‌اکت با انیمیشن blob

gooey-toast یه کتابخانه‌ی توست برای ری‌اکته که ظاهر و رفتارش با نمونه‌های معمول فرق داره. به جای انیمیشن‌های slide یا fade ساده، از یه افکت blob ارگانیک استفاده می‌کنه: توست اول به شکل یه قرص کوچیک ظاهر می‌شه، بعد به یه شکل نرم و «لکه‌مانند» morph می‌کنه تا محتوا نشون بده، و وقتی می‌ره دوباره جمع می‌شه. این انیمیشن با framer-motion پیاده شده.

نصب ساده‌ست — کافیه goey-toast و framer-motion رو نصب کنی، استایل‌شیت رو ایمپورت کنی، و کامپوننت رو یه بار توی app بذاری. بعد از هر جایی می‌تونی gooeyToast.success('Saved!') صدا بزنی.

یکی از قابلیت‌های کاربردی‌اش توست‌های promise هست. یعنی می‌تونی یه promise بهش بدی و اون خودش حالت loading → success/error رو مدیریت می‌کنه:

gooeyToast.promise(saveData(), {
  loading: 'Saving...',
  success: 'Changes saved',
  error: 'Something went wrong',
  action: {
    error: { label: 'Retry', onClick: () => retry() },
  },
})

قابلیت به‌روزرسانی درجا با gooeyToast.update(id, options) هم جالبه — توست رو بدون حذف و ساختن دوباره می‌شه تغییر داد. مثلاً می‌تونی یه توست «در حال آپلود» رو بعد از اتمام به «آپلود کامل شد» تبدیل کنی بدون هیچ جهشی.

از نظر ظاهری، رنگ پس‌زمینه (fillColor)، رنگ و ضخامت بردر، و کلاس‌های CSS هر بخش قابل override هستن. انیمیشن هم خیلی قابل تنظیمه: چهار پریست آماده داره (smooth, bouncy, subtle, snappy)، می‌شه bounce رو با یه عدد بین 0.05 تا 0.8 کنترل کرد، و حتی می‌شه spring رو کلاً خاموش کرد. پشتیبانی از دارک مود، RTL، بستن با کلید Escape، swipe روی موبایل، و نوار پیشرفت شمارش معکوس هم وجود داره.

نکات کلیدی:

• انیمیشن blob ارگانیک (قرص → لکه → قرص) با framer-motion
• پنج نوع توست + توست‌های promise با مدیریت خودکار حالت
• به‌روزرسانی درجا با gooeyToast.update() بدون rebuild
• dismiss بر اساس نوع: gooeyToast.dismiss({ type: 'error' })
• کنترل bounce با یه عدد، چهار پریست انیمیشن آماده
• پشتیبانی از RTL، دارک مود، Escape، swipe و progress bar