<script setup>
// Comp.vue
import { inject } from 'vue'

const props = defineProps({
  title: {
    type: String,
    required: false,
  },
  message: {
    type: String,
    required: false,
  },
  myProp: {
    type: Number,
    required: false,
  },
})

const toast = inject('toast')
/*
toast.value.isActive: boolean
toast.value.isHovered: boolean
toast.value.duration: number
toast.value.timer: Timer instance
toast.value.click: function
toast.value.close: function
*/
</script>

<template>
  <div>
    <strong>{{ props.title }}</strong>
    <p>{{ props.message }}</p>
    <slot></slot>
    <button @click="toast.close">close</button>
    <button @click="toast.click">trigger click</button>
  </div>
</template>