import type { App } from 'vue'

export function outsideClick (app: App<Element>) {

  app.directive('outside-click', {

    mounted (el, binding) {

      el._event = e => {

        console.log(el === e.target, el.contains(e.target))

        if (el === e.target || el.contains(e.target)) {
          return
        }

        if (typeof binding.value === 'function') {
          binding.value(e)
        }
      }

      document.addEventListener('click', el._event)

    },

    unmounted (el) {
      document.removeEventListener('click', el._event)
    }


  })

}