import type { Directive, DirectiveBinding } from 'vue'
import type { Side } from '../constants'
import { render } from 'vue'
import VvTooltip from '../components/VvTooltip/VvTooltip.vue'

const tooltip: Directive = (() => {
    return {
        beforeMount(el: HTMLElement, binding: DirectiveBinding) {
            const tooltip = h(VvTooltip, {
                value: binding.value,
                position: binding.arg as Side,
            })
            render(tooltip, el)
        },
        updated(el: HTMLElement, binding: DirectiveBinding) {
            const tooltip = h(VvTooltip, {
                value: binding.value,
                position: binding.arg as Side,
            })
            render(tooltip, el)
        },
    }
})()

export default tooltip