element-plus/es/components/tooltip-v2/src/content2.mjs

A Component Library for Vue 3

import { defineComponent, inject, ref, computed, unref, onMounted, watch, openBlock, createElementBlock, normalizeStyle, renderSlot, createVNode, withCtx, Fragment, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
import '../../../tokens/index.mjs';
import '../../../hooks/index.mjs';
import '../../visual-hidden/index.mjs';
import { tooltipV2ContentProps } from './content.mjs';
import { tooltipV2CommonProps } from './common.mjs';
import { tooltipV2RootKey } from '../../../tokens/tooltip-v2.mjs';
import { useFloating, arrowMiddleware, getPositionDataWithUnit } from '../../../hooks/use-floating/index.mjs';
import ElVisuallyHidden from '../../visual-hidden/src/visual-hidden.mjs';

const __default__ = {
  name: "ElTooltipV2Content"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: { ...tooltipV2ContentProps, ...tooltipV2CommonProps },
  setup(__props) {
    const props = __props;
    const { triggerRef, contentId } = inject(tooltipV2RootKey);
    const placement = ref(props.placement);
    const strategy = ref(props.strategy);
    const arrowRef = ref();
    const { referenceRef, contentRef, middlewareData, x, y } = useFloating({
      placement,
      strategy,
      middleware: computed(() => {
        const middleware = [];
        if (props.showArrow) {
          middleware.push(arrowMiddleware({
            arrowRef
          }));
        }
        return middleware;
      })
    });
    const contentStyle = computed(() => {
      return {
        position: unref(strategy),
        top: unref(y),
        left: unref(x)
      };
    });
    const arrowStyle = computed(() => {
      if (!props.showArrow)
        return {};
      const _middlewareData = unref(middlewareData);
      return {
        position: "absolute",
        top: getPositionDataWithUnit(_middlewareData, "y"),
        left: getPositionDataWithUnit(_middlewareData, "x")
      };
    });
    onMounted(() => {
      watch(() => props.reference || triggerRef.value, (el) => {
        referenceRef.value = el || void 0;
      });
    });
    return (_ctx, _cache) => {
      return !_ctx.nowrap ? (openBlock(), createElementBlock("div", {
        key: 0,
        ref_key: "contentRef",
        ref: contentRef,
        style: normalizeStyle(unref(contentStyle))
      }, [
        renderSlot(_ctx.$slots, "default"),
        createVNode(unref(ElVisuallyHidden), { id: unref(contentId) }, {
          default: withCtx(() => [
            _ctx.ariaLabel ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
              createTextVNode(toDisplayString(_ctx.ariaLabel), 1)
            ], 2112)) : renderSlot(_ctx.$slots, "default", { key: 1 })
          ]),
          _: 3
        }, 8, ["id"]),
        renderSlot(_ctx.$slots, "arrow", {
          style: normalizeStyle(unref(arrowStyle))
        })
      ], 4)) : createCommentVNode("v-if", true);
    };
  }
});

export { _sfc_main as default };
//# sourceMappingURL=content2.mjs.map