various-ui/lib/components/tooltip/follow/src/composable.js

This is a test version of the Vue 3 component library

'use strict';

var vue = require('vue');
require('../../../../utils/index.js');
var index = require('../../../../utils/src/node/index.js');
var relativeMouseBody = require('../../../../utils/src/dispose/boundary/src/relativeMouseBody.js');
var index$1 = require('../../../../utils/src/animation/index.js');

const useComposable = (define, emits) => {
  const refs = {
    event: vue.ref(),
    //* Event缓存
    active: vue.ref(false),
    //* 激活状态
    visible: vue.ref(false),
    //* 隐藏状态
    visibleTimer: vue.ref()
    //* 隐藏状态延迟器
  };
  const nodes = {
    tooltip: vue.ref()
  };
  const methods = {
    //* 视图控制器 显示
    show: (ev, initialization) => {
      refs.visibleTimer.value && clearTimeout(refs.visibleTimer.value);
      refs.visibleTimer.value = void 0;
      refs.visible.value = true;
      vue.nextTick(() => {
        if (ev && nodes.tooltip.value) {
          refs.event.value = ev;
          index.append(document.body, nodes.tooltip.value);
          relativeMouseBody.relativeMouseBody(ev, nodes.tooltip.value, {
            offsetX: define.offsetX,
            offsetY: define.offsetY,
            initialization
          });
        }
      });
    },
    //* 视图控制器 隐藏
    hidden: (delay = 200) => {
      refs.visibleTimer.value && clearTimeout(refs.visibleTimer.value);
      refs.visibleTimer.value = setTimeout(() => {
        refs.visible.value = false;
      }, delay);
    }
  };
  const computeds = {
    //* 样式
    style: vue.computed(() => {
      const result = {
        zIndex: define.zIndex || 66
      };
      if (define.width) result["max-width"] = `${define.width}px`;
      return result;
    })
  };
  const ons = {
    animation: index$1.tooltip({
      afterEnter: () => emits("after-enter"),
      afterLeave: () => emits("after-leave"),
      beforeEnter: () => {
        refs.active.value = true;
        emits("before-enter");
      },
      beforeLeave: () => {
        refs.active.value = false;
        emits("before-leave");
      }
    }),
    container: {
      mouseenter: (ev) => !define.disabled && methods.show(ev, true),
      mouseleave: () => !define.disabled && methods.hidden(),
      mousemove: (ev) => !define.disabled && methods.show(ev)
    },
    content: {
      mouseleave: () => !define.disabled && methods.hidden(),
      mouseenter: () => {
        if (!define.disabled) {
          refs.visible.value = true;
          refs.event.value && methods.show(refs.event.value);
        }
      }
    }
  };
  return { ons, refs, nodes, methods, computeds };
};

exports.useComposable = useComposable;
//# sourceMappingURL=composable.js.map