import { defineComponent, ref, onMounted, watch, onActivated, onDeactivated, openBlock, createElementBlock, createElementVNode, normalizeStyle, createVNode, unref, mergeProps, createCommentVNode, withCtx, createBlock, renderSlot, createTextVNode, toDisplayString } from 'vue';
import { useClipboard, useElementSize, useResizeObserver } from '@vueuse/core';
import { ElMessage, ElTooltip, ElText } from 'element-plus';
import { AutoEllipsis } from 'auto-ellipsis-text';
import { MeSvgIcon } from '../../svg-icon/index.mjs';
import { MeDot } from '../../dot/index.mjs';

"use strict";
const _hoisted_1 = { style: { "height": "100%" } };
const _hoisted_2 = { key: 1 };
const _hoisted_3 = { key: 1 };
const _hoisted_4 = {
  key: 2,
  style: { "margin-left": "6px", "height": "100%" },
  class: "icon"
};
const _hoisted_5 = {
  key: 3,
  style: { "margin-left": "6px", "height": "100%" },
  class: "icon link"
};
const __default__ = defineComponent({
  name: "me-text"
});
var script = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    text: { type: String, required: false, default: "" },
    color: { type: String, required: false, default: "#999999" },
    link: { type: String, required: false },
    upperCase: { type: Boolean, required: false, default: false },
    toolTip: { type: Boolean, required: false, default: false },
    lineClamp: { type: [Number, String], required: false, default: 1 },
    suffix: { type: Boolean, required: false },
    dot: { type: Boolean, required: false, default: false },
    dotColor: { type: String, required: false, default: "red" },
    dotSetting: { type: null, required: false, default: {} },
    dotSpace: { type: String, required: false, default: "5px" },
    expand: { type: Boolean, required: false, default: false },
    copy: { type: Boolean, required: false, default: true },
    customClass: { type: String, required: false },
    height: { type: String, required: false },
    width: { type: String, required: false, default: "100%" }
  },
  setup(__props) {
    ;
    const props = __props;
    const { copy } = useClipboard({ legacy: true });
    const show = ref(true);
    const isExpand = ref(false);
    const isOver = ref(false);
    const divRef = ref();
    const contentDivRef = ref();
    const elTextRef = ref();
    const divWidth = useElementSize(divRef).width;
    const contentDivWidth = useElementSize(contentDivRef).width;
    const content = ref("");
    const textHeight = ref(0);
    const tooltipRef = ref();
    onMounted(() => {
      if (!elTextRef.value) return;
      tooltipRef.value.show = ref({ value: false });
      textHeight.value = elTextRef.value.$el.clientHeight;
      isOver.value = elTextRef.value.$el.scrollHeight > elTextRef.value.$el.clientHeight;
      tooltipRef.value.show.value = isOver.value;
      const text = elTextRef.value.$el.innerText;
      if (props.upperCase) {
        content.value = text.toUpperCase();
      } else {
        content.value = text;
      }
    });
    useResizeObserver(elTextRef, (entries) => {
      const entry = entries[0];
      const { scrollHeight, clientHeight } = entry.target;
      tooltipRef.value.show.value = scrollHeight > clientHeight;
    });
    watch([divWidth, () => contentDivWidth.value], ([newWidth1, newWidth2]) => {
      if (+props.lineClamp <= 1) {
        if (newWidth1 > newWidth2) {
          isOver.value = true;
        } else {
          isOver.value = false;
        }
      } else {
        const res = elTextRef.value?.$el.scrollHeight <= elTextRef.value?.$el.clientHeight;
        isOver.value = res;
      }
    });
    onActivated(() => {
      show.value = true;
    });
    onDeactivated(() => {
      show.value = false;
    });
    const handleCopy = async () => {
      try {
        const text = elTextRef.value.$el.innerText;
        const res = await copy(text);
        ElMessage({
          message: "\u590D\u5236\u6210\u529F",
          type: "success",
          plain: true
        });
      } catch (error) {
      }
    };
    const handleLink = () => {
      window.open(props.link, "_blank");
    };
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock(
        "div",
        {
          ref_key: "divRef",
          ref: divRef,
          style: { "width": "100%" },
          class: "me-text"
        },
        [
          createElementVNode(
            "div",
            {
              ref_key: "contentDivRef",
              ref: contentDivRef,
              class: "content",
              style: normalizeStyle([{}, { width: __props.suffix ? "100%" : "fit-content", height: props.height }])
            },
            [
              __props.dot && content.value ? (openBlock(), createElementBlock(
                "div",
                {
                  key: 0,
                  style: normalizeStyle([{ "align-self": "flex-start" }, { height: __props.suffix ? "16px" : textHeight.value + "px", "margin-right": __props.dotSpace }])
                },
                [
                  createVNode(unref(MeDot), mergeProps({ color: __props.dotColor }, __props.dotSetting), null, 16, ["color"])
                ],
                4
                /* STYLE */
              )) : createCommentVNode("v-if", true),
              createElementVNode("div", _hoisted_1, [
                createVNode(unref(ElTooltip), mergeProps({
                  ref_key: "tooltipRef",
                  ref: tooltipRef,
                  effect: "light",
                  disabled: !__props.toolTip || !tooltipRef.value?.show.value || isExpand.value,
                  placement: "bottom"
                }, _ctx.$attrs), {
                  content: withCtx(() => [
                    createElementVNode(
                      "div",
                      {
                        style: normalizeStyle({ width: unref(divWidth) + "px" })
                      },
                      toDisplayString(content.value),
                      5
                      /* TEXT, STYLE */
                    )
                  ]),
                  default: withCtx(() => [
                    !__props.suffix ? (openBlock(), createElementBlock(
                      "div",
                      {
                        key: 0,
                        style: normalizeStyle({ color: __props.color })
                      },
                      [
                        !isExpand.value ? (openBlock(), createBlock(unref(ElText), mergeProps({
                          key: 0,
                          ref_key: "elTextRef",
                          ref: elTextRef
                        }, { lineClamp: __props.lineClamp, ..._ctx.$attrs }, {
                          style: { color: __props.color },
                          class: { link: __props.link }
                        }), {
                          default: withCtx(() => [
                            renderSlot(_ctx.$slots, "default", {}, () => [
                              createTextVNode(
                                toDisplayString(content.value),
                                1
                                /* TEXT */
                              )
                            ])
                          ]),
                          _: 3
                          /* FORWARDED */
                        }, 16, ["style", "class"])) : createCommentVNode("v-if", true),
                        isExpand.value ? (openBlock(), createElementBlock("span", _hoisted_2, [
                          renderSlot(_ctx.$slots, "default", {}, () => [
                            createTextVNode(
                              toDisplayString(content.value),
                              1
                              /* TEXT */
                            )
                          ])
                        ])) : createCommentVNode("v-if", true)
                      ],
                      4
                      /* STYLE */
                    )) : createCommentVNode("v-if", true)
                  ]),
                  _: 3
                  /* FORWARDED */
                }, 16, ["disabled"])
              ]),
              __props.suffix ? (openBlock(), createElementBlock(
                "div",
                {
                  key: 1,
                  style: normalizeStyle([{ "width": "100%" }, { color: __props.color }])
                },
                [
                  !isExpand.value && show.value ? (openBlock(), createBlock(unref(AutoEllipsis), {
                    key: 0,
                    suffix: true,
                    "start-ellpsis-line": __props.lineClamp,
                    ref_key: "elTextRef",
                    ref: elTextRef
                  }, {
                    default: withCtx(() => [
                      renderSlot(_ctx.$slots, "default")
                    ]),
                    _: 3
                    /* FORWARDED */
                  }, 8, ["start-ellpsis-line"])) : createCommentVNode("v-if", true),
                  isExpand.value ? (openBlock(), createElementBlock("span", _hoisted_3, [
                    renderSlot(_ctx.$slots, "default", {}, () => [
                      createTextVNode(
                        toDisplayString(content.value),
                        1
                        /* TEXT */
                      )
                    ])
                  ])) : createCommentVNode("v-if", true)
                ],
                4
                /* STYLE */
              )) : createCommentVNode("v-if", true),
              props.copy ? (openBlock(), createElementBlock("div", _hoisted_4, [
                renderSlot(_ctx.$slots, "icon", {}, () => [
                  createVNode(unref(MeSvgIcon), {
                    onClick: handleCopy,
                    name: "ri-file-copy-line"
                  })
                ])
              ])) : createCommentVNode("v-if", true),
              __props.link ? (openBlock(), createElementBlock("div", _hoisted_5, [
                createVNode(unref(MeSvgIcon), {
                  onClick: handleLink,
                  name: "ri-external-link-line"
                })
              ])) : createCommentVNode("v-if", true)
            ],
            4
            /* STYLE */
          ),
          !isOver.value && __props.expand ? (openBlock(), createElementBlock(
            "div",
            {
              key: 0,
              style: normalizeStyle([{ width: unref(contentDivWidth) + "px" }, { "text-align": "center", "cursor": "pointer" }]),
              class: "expand"
            },
            [
              createVNode(unref(MeSvgIcon), {
                size: 20,
                onClick: _cache[0] || (_cache[0] = ($event) => isExpand.value = !isExpand.value),
                name: isExpand.value ? "ri-arrow-up-s-fill" : "ri-arrow-down-s-fill"
              }, null, 8, ["name"])
            ],
            4
            /* STYLE */
          )) : createCommentVNode("v-if", true)
        ],
        512
        /* NEED_PATCH */
      );
    };
  }
});

export { script as default };
//# sourceMappingURL=text.vue2.mjs.map
