fix(#3,#4,#6,#8): _palette从THEMES读取颜色; countdown全局替换; queue保留用户onClose; WeakMap→Map并清理
This commit is contained in:
+14
-16
@@ -6,13 +6,15 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
import { generateId, escapeHTML, prefersDark } from './utils.js';
|
import { generateId, escapeHTML, prefersDark } from './utils.js';
|
||||||
import { DEFAULTS, ICONS, TYPE_COLORS } from './constants.js';
|
import { DEFAULTS, ICONS, TYPE_COLORS, THEMES } from './constants.js';
|
||||||
import { injectStyles } from './styles.js';
|
import { injectStyles } from './styles.js';
|
||||||
import { getTheme, applyTheme } from './themes.js';
|
import { getTheme, applyTheme } from './themes.js';
|
||||||
import { t as i18nT, setCurrentLocale } from './i18n.js';
|
import { t as i18nT, setCurrentLocale } from './i18n.js';
|
||||||
|
|
||||||
// 模块级共享容器缓存,所有 Toast 实例共用
|
// 模块级共享容器缓存,所有 Toast 实例共用
|
||||||
const _containerCache = new WeakMap();
|
// 使用 Map 而非 WeakMap:document.body 在页面存活期间永不被 GC,
|
||||||
|
// 容器需要显式通过 destroy() 清理,WeakMap 在此场景无实际收益。
|
||||||
|
const _containerCache = new Map();
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 参数标准化工具
|
* 参数标准化工具
|
||||||
@@ -90,17 +92,8 @@ class Toast {
|
|||||||
_palette() {
|
_palette() {
|
||||||
const theme = getTheme(this.config.theme);
|
const theme = getTheme(this.config.theme);
|
||||||
const c = TYPE_COLORS[this.type] || TYPE_COLORS.default;
|
const c = TYPE_COLORS[this.type] || TYPE_COLORS.default;
|
||||||
const t = theme === 'dark'
|
const tc = THEMES[theme] || THEMES.light;
|
||||||
? {
|
const t = { bg: tc.bg, border: tc.border, shadow: tc.shadow };
|
||||||
bg: 'rgba(28,32,40,.94)',
|
|
||||||
border: 'rgba(255,255,255,.08)',
|
|
||||||
shadow: '0 10px 36px -10px rgba(0,0,0,.6),0 4px 14px -4px rgba(0,0,0,.4)'
|
|
||||||
}
|
|
||||||
: {
|
|
||||||
bg: 'rgba(255,255,255,.96)',
|
|
||||||
border: 'rgba(0,0,0,.06)',
|
|
||||||
shadow: '0 10px 36px -10px rgba(0,0,0,.18),0 4px 14px -4px rgba(0,0,0,.08)'
|
|
||||||
};
|
|
||||||
return { theme, c, t };
|
return { theme, c, t };
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -922,7 +915,7 @@ const meToast = {
|
|||||||
const t = this._emit({
|
const t = this._emit({
|
||||||
...opts,
|
...opts,
|
||||||
type: opts.type || 'warning',
|
type: opts.type || 'warning',
|
||||||
message: message.replace('{seconds}', remaining),
|
message: message.replace(/\{seconds\}/g, remaining),
|
||||||
duration: 0,
|
duration: 0,
|
||||||
closeButton: true,
|
closeButton: true,
|
||||||
showProgress: false,
|
showProgress: false,
|
||||||
@@ -946,7 +939,7 @@ const meToast = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
t.update({
|
t.update({
|
||||||
message: message.replace('{seconds}', remaining),
|
message: message.replace(/\{seconds\}/g, remaining),
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@@ -986,6 +979,7 @@ const meToast = {
|
|||||||
return new Promise((resolve) => {
|
return new Promise((resolve) => {
|
||||||
let index = 0;
|
let index = 0;
|
||||||
const delay = opts.delay || 1000;
|
const delay = opts.delay || 1000;
|
||||||
|
const userOnClose = opts.onClose;
|
||||||
|
|
||||||
const showNext = () => {
|
const showNext = () => {
|
||||||
if (index >= messages.length) {
|
if (index >= messages.length) {
|
||||||
@@ -1003,7 +997,10 @@ const meToast = {
|
|||||||
...((typeof message === 'object' && message !== null) ? message : {}),
|
...((typeof message === 'object' && message !== null) ? message : {}),
|
||||||
message: msg,
|
message: msg,
|
||||||
duration: opts.duration || 3000,
|
duration: opts.duration || 3000,
|
||||||
onClose: () => {
|
onClose: (toast) => {
|
||||||
|
if (typeof userOnClose === 'function') {
|
||||||
|
try { userOnClose(toast); } catch (_) {}
|
||||||
|
}
|
||||||
setTimeout(showNext, delay);
|
setTimeout(showNext, delay);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
@@ -1064,6 +1061,7 @@ const meToast = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
this._toasts.clear();
|
this._toasts.clear();
|
||||||
|
_containerCache.clear();
|
||||||
},
|
},
|
||||||
|
|
||||||
getAll() {
|
getAll() {
|
||||||
|
|||||||
Reference in New Issue
Block a user