/** * MetonaToast Templates — HTML 模板辅助函数 * @module templates * @version 0.5.1 * @description confirm / prompt / progress / action 的 DOM 模板 */ import { escapeHTML } from './utils.js'; import { t } from './i18n.js'; import type { ActionButton, ConfirmOptions, PromptOptions, ProgressOptions } from './types.js'; /** * 按钮行模板 — confirm/prompt 共用 */ export const btnRow = (buttons: string): string => `
${buttons}
`; /** * 确认对话框模板 */ export const confirmHTML = (opts: ConfirmOptions): string => { const confirmText = opts.confirmText || t('confirm'); const cancelText = opts.cancelText || t('cancel'); const confirmColor = opts.confirmColor || '#10b981'; const cancelColor = opts.cancelColor || '#6b7280'; return btnRow(` `); }; /** * 输入对话框模板 */ export const promptHTML = (opts: PromptOptions): string => { const submitText = opts.submitText || t('confirm'); const cancelText = opts.cancelText || t('cancel'); const submitColor = opts.submitColor || '#3b82f6'; const cancelColor = opts.cancelColor || '#6b7280'; return ` ${btnRow(` `)} `; }; /** * 进度条模板 */ export const progressHTML = (opts: ProgressOptions): string => { const color = opts.progressColor || '#3b82f6'; return `
0%
`; }; /** * Action Toast 模板 */ export const actionHTML = (actions: ActionButton[]): string => { if (!Array.isArray(actions) || actions.length === 0) return ''; const buttons = actions.map((a, i) => { const bg = a.style?.background || a.color || '#6366f1'; const cls = `met-action-btn-${i}`; return ``; }).join(''); return btnRow(buttons); };