import { w as withInstall } from "../badge/index2.js";
import { defineComponent, useSlots, ref, toRef, shallowRef, computed, watch, onMounted, openBlock, createBlock, Teleport, withDirectives, createVNode, Transition, withCtx, createElementVNode, normalizeClass, normalizeStyle, renderSlot, createTextVNode, toDisplayString, vShow, createCommentVNode, nextTick, getCurrentInstance, createElementBlock, Fragment, normalizeProps, mergeProps, unref } from "vue";
import { o as onClickOutside, a as useResizeObserver, c as useEventListener, b as useThrottleFn } from "../_chunks/@vueuse/index.js";
var index$1 = /* @__PURE__ */ (() => ".lay-tooltip-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}\n")();
var index = /* @__PURE__ */ (() => '.layui-popper{position:fixed;padding:10px;border-radius:3px;word-wrap:break-word;min-width:12px;min-height:12px;font-size:14px;box-sizing:border-box;box-shadow:0 2px 12px #00000026;background-color:#fff;color:#3a3a3a;border:1px solid #cecece;max-width:300px;z-index:99999}.layui-popper[position=top]{margin-bottom:6px}.layui-popper[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#cecece}.layui-popper[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#fff}.layui-popper[position=bottom]{margin-top:6px}.layui-popper[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#cecece}.layui-popper[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-color:#fff}.layui-popper[position=right]{margin-left:6px}.layui-popper[position=right] .layui-popper-arrow{left:-6px;border-left-width:0;border-right-color:#cecece}.layui-popper[position=right] .layui-popper-arrow:after{left:1px;border-left-width:0;margin-top:-6px;border-right-color:#fff}.layui-popper[position=left]{margin-right:6px}.layui-popper[position=left] .layui-popper-arrow{right:-6px;border-right-width:0;border-left-color:#cecece}.layui-popper[position=left] .layui-popper-arrow:after{right:1px;border-right-width:0;margin-top:-6px;border-left-color:#fff}.layui-popper[position=top] .layui-popper-arrow,.layui-popper[position=bottom] .layui-popper-arrow{left:-moz-calc(44%);left:-webkit-calc(44%);left:calc(50% - 6px)}.layui-popper[position=left] .layui-popper-arrow,.layui-popper[position=right] .layui-popper-arrow{top:-moz-calc(44%);top:-webkit-calc(44%);top:calc(50% - 6px)}.layui-popper:after{content:" ";position:absolute;display:block}.layui-popper[position=top]:after{bottom:-7px;left:0;width:100%;height:7px}.layui-popper[position=bottom]:after{top:-7px;left:0;width:100%;height:7px}.layui-popper[position=left]:after{right:-7px;bottom:0;height:100%;width:7px}.layui-popper[position=right]:after{left:-7px;bottom:0;height:100%;width:7px}.layui-popper .layui-popper-arrow,.layui-popper .layui-popper-arrow:after{position:absolute;display:block;width:0;height:0;border-width:6px;border-style:solid;border-color:transparent}.layui-popper .layui-popper-arrow:after{content:" "}.layui-popper.layui-dark{background-color:#353535;color:#fff;border:1px solid #353535}.layui-popper.layui-dark[position=top]{margin-bottom:6px}.layui-popper.layui-dark[position=top] .layui-popper-arrow{bottom:-6px;border-bottom-width:0;border-top-color:#353535}.layui-popper.layui-dark[position=top] .layui-popper-arrow:after{bottom:1px;border-bottom-width:0;margin-left:-6px;border-top-color:#353535}.layui-popper.layui-dark[position=bottom]{margin-top:6px}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow{top:-6px;border-top-width:0;border-bottom-color:#353535}.layui-popper.layui-dark[position=bottom] .layui-popper-arrow:after{top:1px;border-top-width:0;margin-left:-6px;border-bottom-color:#353535}.layui-popper.layui-dark[position=right]{margin-left:6px}.layui-popper.layui-dark[position=right] .layui-popper-arrow{left:-6px;border-left-width:0;border-right-color:#353535}.layui-popper.layui-dark[position=right] .layui-popper-arrow:after{left:1px;border-left-width:0;margin-top:-6px;border-right-color:#353535}.layui-popper.layui-dark[position=left]{margin-right:6px}.layui-popper.layui-dark[position=left] .layui-popper-arrow{right:-6px;border-right-width:0;border-left-color:#353535}.layui-popper.layui-dark[position=left] .layui-popper-arrow:after{right:1px;border-right-width:0;margin-top:-6px;border-left-color:#353535}\n')();
const postionFns = {
  top(el, popper, innnerPosition, called) {
    let { top, left, bottom } = el.getBoundingClientRect();
    if ((top = top - popper.offsetHeight - 6) < 0 && bottom > popper.offsetHeight) {
      innnerPosition.value = "bottom";
      top = bottom;
    } else {
      innnerPosition.value = "top";
    }
    return {
      top: `${top}px`,
      left: `${left - (popper.offsetWidth - el.offsetWidth) / 2}px`
    };
  },
  bottom(el, popper, innnerPosition, called) {
    let { top, left, bottom } = el.getBoundingClientRect();
    if (window.innerHeight - bottom < popper.offsetHeight + 6) {
      innnerPosition.value = "top";
      bottom = top - popper.offsetHeight - 6;
    } else {
      innnerPosition.value = "bottom";
    }
    return {
      top: `${bottom}px`,
      left: `${left - (popper.offsetWidth - el.offsetWidth) / 2}px`
    };
  },
  left(el, popper, innnerPosition, called) {
    let { top, left, right } = el.getBoundingClientRect();
    left = left - popper.offsetWidth - 6;
    if (left < 0) {
      innnerPosition.value = "right";
      left = right;
    } else {
      innnerPosition.value = "left";
    }
    return {
      top: `${top - (popper.offsetHeight - el.offsetHeight) / 2}px`,
      left: `${left}px`
    };
  },
  right(el, popper, innnerPosition, called) {
    let { top, left, right } = el.getBoundingClientRect();
    if (window.innerWidth < right + popper.offsetWidth + 6) {
      innnerPosition.value = "left";
      right = left - popper.offsetWidth - 6;
    } else {
      innnerPosition.value = "right";
    }
    return {
      top: `${top - (popper.offsetHeight - el.offsetHeight) / 2}px`,
      left: `${right}px`
    };
  }
};
const _hoisted_1 = ["position"];
const _hoisted_2 = /* @__PURE__ */ createElementVNode("div", { class: "layui-popper-arrow" }, null, -1);
const NAME = "LayPopper";
const __default__$1 = {
  name: NAME
};
const _sfc_main$1 = defineComponent({
  ...__default__$1,
  props: {
    el: null,
    position: { default: "top" },
    enterable: { type: Boolean, default: true },
    isDark: { type: Boolean, default: true },
    disabled: { type: Boolean, default: false },
    isCanHide: { type: Boolean, default: true },
    isAutoShow: { type: Boolean, default: false },
    visible: { type: Boolean, default: false },
    content: null,
    trigger: { default: "hover" },
    popperClass: null,
    popperStyle: null
  },
  setup(__props) {
    const props = __props;
    useSlots();
    const style = ref({ top: -window.innerHeight + "px", left: 0 });
    const triggerRefEl = toRef(props, "el");
    const popperRefEl = shallowRef({});
    const innnerPosition = ref(props.position);
    const innerVisible = ref(props.visible);
    const isExist = ref(props.visible);
    let scrollElements;
    const triggerMethods = computed(() => [].concat(props.trigger));
    const doShow = function() {
      if (!props.disabled) {
        if (!isExist.value) {
          isExist.value = true;
          nextTick(() => {
            innerVisible.value = true;
          });
        } else {
          innerVisible.value = true;
        }
      }
    };
    const doHidden = function(e) {
      if (props.isCanHide === false) {
        return;
      }
      innerVisible.value = false;
      innnerPosition.value = props.position;
      style.value = { top: -window.innerHeight + "px", left: 0 };
    };
    const calcPosistion = function() {
      postionFns[props.position] && (style.value = postionFns[props.position](triggerRefEl.value, popperRefEl.value, innnerPosition));
    };
    const updatePosistion = function() {
      if (innerVisible.value) {
        popperRefEl.value.offsetWidth === 0 ? nextTick(() => calcPosistion()) : calcPosistion();
        nextTick(() => {
          calcPosistion();
        });
      }
    };
    const handlerPopperMouseEnter = function() {
      if (triggerMethods.value.includes("hover") && props.enterable) {
        doShow();
      }
    };
    const handlerPopperMouseLeave = function() {
      if (triggerMethods.value.includes("hover") && props.enterable) {
        doHidden();
      }
    };
    const handlerTriggerClick = function() {
      if (!triggerMethods.value.includes("click"))
        return;
      if (innerVisible.value) {
        doHidden();
      } else {
        doShow();
      }
    };
    const handleTriggerContextMenu = function(e) {
      if (!triggerMethods.value.includes("contextMenu"))
        return;
      e.preventDefault();
      if (innerVisible.value) {
        doHidden();
      } else {
        doShow();
      }
    };
    const handlerTriggerMouseEnter = function() {
      if (!triggerMethods.value.includes("hover"))
        return;
      doShow();
    };
    const handlerTriggerMouseLeave = function() {
      if (!triggerMethods.value.includes("hover"))
        return;
      doHidden();
    };
    const handleTriggerFocusin = function() {
      if (triggerMethods.value.includes("focus") && props.enterable) {
        doShow();
      }
    };
    const handleTriggerFocusout = function() {
      if (triggerMethods.value.includes("focus") && props.enterable) {
        doHidden();
      }
    };
    const handlerTriggerEventRegist = function() {
      useEventListener(triggerRefEl.value, "click", handlerTriggerClick);
      useEventListener(triggerRefEl.value, "contextmenu", handleTriggerContextMenu);
      useEventListener(triggerRefEl.value, "mouseenter", handlerTriggerMouseEnter);
      useEventListener(triggerRefEl.value, "mouseleave", handlerTriggerMouseLeave);
      useEventListener(triggerRefEl.value, "focusin", handleTriggerFocusin);
      useEventListener(triggerRefEl.value, "focusout", handleTriggerFocusout);
    };
    const handleScroll = useThrottleFn(() => {
      if (innerVisible.value) {
        updatePosistion();
      }
    }, 15);
    onClickOutside(triggerRefEl.value, (e) => {
      if (!innerVisible.value || triggerRefEl.value.contains(e.target) || popperRefEl.value.contains(e.target)) {
        return;
      }
      doHidden();
    }, {
      ignore: [popperRefEl.value]
    });
    useResizeObserver(triggerRefEl, () => {
      updatePosistion();
    });
    let popperObserver = void 0;
    watch(innerVisible, (isShow) => {
      updatePosistion();
      if (isShow) {
        popperObserver = useResizeObserver(popperRefEl, () => {
          updatePosistion();
        });
      } else {
        popperObserver && popperObserver.stop();
      }
    });
    watch(() => props.visible, (isShow) => isShow ? doShow() : doHidden());
    watch(() => props.content, () => {
      updatePosistion();
    });
    const isScrollElement = function(element) {
      return element.scrollHeight > element.offsetHeight || element.scrollWidth > element.offsetWidth;
    };
    const getScrollElements = function(container) {
      var _a;
      const scrollElements2 = [];
      let element = container;
      while (element && element !== document.documentElement) {
        if (isScrollElement(element)) {
          scrollElements2.push(element);
        }
        element = (_a = element.parentElement) != null ? _a : void 0;
      }
      return scrollElements2;
    };
    onMounted(() => {
      updatePosistion();
      scrollElements = getScrollElements(triggerRefEl.value);
      for (const item of scrollElements) {
        useEventListener(item, "scroll", handleScroll);
      }
      useEventListener("resize", handleScroll);
      handlerTriggerEventRegist();
    });
    return (_ctx, _cache) => {
      return isExist.value ? (openBlock(), createBlock(Teleport, {
        key: 0,
        to: "body"
      }, [
        withDirectives(createVNode(Transition, null, {
          default: withCtx(() => {
            var _a;
            return [
              createElementVNode("div", {
                ref_key: "popperRefEl",
                ref: popperRefEl,
                class: normalizeClass(["layui-popper", { "layui-dark": __props.isDark }, props.popperClass]),
                style: normalizeStyle([style.value, (_a = props.popperStyle) != null ? _a : ""]),
                position: innnerPosition.value,
                onMouseenter: handlerPopperMouseEnter,
                onMouseleave: handlerPopperMouseLeave
              }, [
                renderSlot(_ctx.$slots, "default", {}, () => [
                  createTextVNode(toDisplayString(__props.content), 1)
                ]),
                _hoisted_2
              ], 46, _hoisted_1)
            ];
          }),
          _: 3
        }, 512), [
          [vShow, innerVisible.value]
        ])
      ])) : createCommentVNode("", true);
    };
  }
});
const __default__ = {
  name: "LayTooltip",
  inheritAttrs: false
};
const _sfc_main = defineComponent({
  ...__default__,
  props: {
    content: {
      type: [Number, String],
      required: false
    },
    position: {
      type: String,
      default: "top"
    },
    isDark: {
      type: Boolean,
      default: true
    },
    disabled: {
      type: Boolean,
      default: false
    },
    isCanHide: {
      type: Boolean,
      default: true
    },
    isAutoShow: {
      type: Boolean,
      default: false
    },
    visible: {
      type: Boolean,
      default: false
    },
    trigger: {
      type: String,
      default: "hover"
    },
    enterable: {
      type: Boolean,
      default: true
    },
    popperClass: {
      type: [String, Array, Object]
    },
    popperStyle: {
      type: [String, Object]
    }
  },
  setup(__props) {
    const props = __props;
    const vm = getCurrentInstance();
    const isMounted = ref(false);
    const tooltipRefEl = shallowRef(void 0);
    const innerProps = computed(() => {
      return { el: vm.proxy.$el.nextElementSibling, ...vm.proxy.$props };
    });
    const setEllipsis = function() {
      var _a;
      if (tooltipRefEl.value) {
        let tooltipHtml = tooltipRefEl.value;
        if (tooltipHtml.offsetWidth >= ((_a = tooltipHtml.firstChild) == null ? void 0 : _a.offsetWidth)) {
          isMounted.value = false;
        } else {
          isMounted.value = true;
        }
      } else {
        isMounted.value = true;
      }
    };
    onMounted(() => {
      if (props.isAutoShow) {
        useEventListener("resize", () => {
          setEllipsis();
        });
      }
      nextTick(() => {
        setEllipsis();
      });
    });
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock(Fragment, null, [
        __props.isAutoShow ? (openBlock(), createElementBlock("div", {
          key: 0,
          ref_key: "tooltipRefEl",
          ref: tooltipRefEl,
          class: "lay-tooltip-content"
        }, [
          createElementVNode("span", null, [
            renderSlot(_ctx.$slots, "default")
          ])
        ], 512)) : renderSlot(_ctx.$slots, "default", { key: 1 }),
        isMounted.value ? (openBlock(), createBlock(_sfc_main$1, normalizeProps(mergeProps({ key: 2 }, unref(innerProps))), {
          default: withCtx(() => [
            renderSlot(_ctx.$slots, "content")
          ]),
          _: 3
        }, 16)) : createCommentVNode("", true)
      ], 64);
    };
  }
});
const component = withInstall(_sfc_main);
export { _sfc_main as _, component as c };
