<template>
  <div class="wrap">
    <el-tooltip v-if="show"
      v-bind="$attrs">
      <slot></slot>
    </el-tooltip>
    <div @mouseenter="show = true"
      @mouseleave="show = false"
      v-else>
      <slot></slot>
    </div>
  </div>
</template>

<script setup
  name="xl-tooltip">
  const show = ref(false)
</script>

<style scoped
  lang="scss">
  .wrap {
    display: inline-block;
  }
</style>