49 lines
1.1 KiB
Vue
49 lines
1.1 KiB
Vue
<!-- eslint-disable vue/multi-word-component-names -->
|
|
<template>
|
|
<div style="display: none">
|
|
<div v-bind="$attrs" ref="message">
|
|
<slot name="default" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { Options as ToastOptions, toast } from "bulma-toast";
|
|
import { onMounted, useTemplateRef } from "vue";
|
|
|
|
export type HBulmaToast = {
|
|
show(options: ToastOptions): void;
|
|
hide(): void;
|
|
};
|
|
|
|
const emit = defineEmits<{
|
|
(event: "handle", handle: HBulmaToast): void;
|
|
}>();
|
|
|
|
const message = useTemplateRef("message");
|
|
|
|
onMounted(() =>
|
|
emit("handle", {
|
|
show(options: ToastOptions = {}) {
|
|
if (!(message.value instanceof HTMLElement)) return;
|
|
|
|
toast({
|
|
...options,
|
|
single: true,
|
|
message: message.value,
|
|
});
|
|
},
|
|
hide() {
|
|
if (message.value === null) return;
|
|
|
|
const toast_div = message.value.parentElement;
|
|
if (toast_div === null) return;
|
|
|
|
const dbutton = toast_div.querySelector("button.delete");
|
|
if (!(dbutton instanceof HTMLButtonElement)) return;
|
|
|
|
dbutton.click();
|
|
},
|
|
}),
|
|
);
|
|
</script>
|