Add toast notification system: implement useToast composable and ToastContainer component

This commit is contained in:
lucast committed 2025-12-05 17:39:37 +01:00
1 parent 46951be40f
commit 2b368cede4
2 files changed
+107

No files matched your search

+30
View File
@@ -0,0 +1,30 @@
type Toast = {
id: number
message: string
type?: "success" | "error" | "info"
}
const toasts = ref<Toast[]>([])
export const useToast = () => {
const show = (
message: string,
type: Toast["type"] = "info",
duration = 5 * 1000
): number => {
const id = toasts.value.length + 1
toasts.value.push({ id, message, type })
setTimeout(() => {
remove(id)
}, duration)
return id
}
const remove = (id: number) => {
toasts.value = toasts.value.filter((t) => t.id != id)
}
return { toasts, show, remove }
}