<template>
  <div><slot></slot></div>
</template>

<script>
import elementResizeDetectorMaker from 'element-resize-detector'
import {hasSize} from '@uif/core/lib/utils/dom'
export default {
  name: 'u-detector',
  mounted () {
    this.detector = elementResizeDetectorMaker()
    this.detector.listenTo(this.$el, this.observer)
  },
  beforeDestroy () {
    if (this.detector) {
      this.detector.removeListener(this.$el, this.observer)
    }
  },
  methods: {
    observer (event) {
      if (hasSize(this.$el)) {
        this.$emit('update', event)
      }
    }
  }
}
</script>
