File size: 1,868 Bytes
01fcadf |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 |
<script lang="ts">
import { type Position, type Props, type ToastType } from "@utils/toast.ts";
import toast from "svelte-french-toast";
export let toastProp: Props;
function handleToast(toastProp: Props) {
switch (toastProp.toastType) {
case "success":
toast.success(toastProp.text, {
style: "background: var(--navbar-color); color: var(--input-text-color);",
icon: toastProp.emoji,
position: toastProp.position ?? "bottom-right",
duration: toastProp.duration
});
break;
case "error":
toast.error(toastProp.text, {
style: "background: var(--navbar-color); color: var(--input-text-color);",
icon: toastProp.emoji,
position: toastProp.position ?? "bottom-right",
duration: toastProp.duration
});
break;
case "promise":
throw new Error("Due to the way astro renders promise toasts are not available (ish)");
break;
case "multiline":
toast(toastProp.text, {
style: "background: var(--navbar-color); color: var(--input-text-color);",
icon: toastProp.emoji,
position: toastProp.position ?? "bottom-right",
duration: toastProp.duration
});
break;
default:
throw new Error("Something isn't right...");
break;
}
}
</script>
<!-- A hacky way to get this to be called. Just click this button (preferably via an EVENT) (see ../../utils/toast.ts) -->
<button id={toastProp.id} class:invisible={'invisible'} class:hidden={'hidden'} class={toastProp.class} on:click={() => {return handleToast(toastProp)}}>Auto clicked for toast notifs</button>
|