element-plus/lib/components/tooltip-v2/src/content2.js

A Component Library for Vue 3

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var vue = require('vue');
require('../../../tokens/index.js');
require('../../../hooks/index.js');
require('../../visual-hidden/index.js');
var content = require('./content.js');
var common = require('./common.js');
var tooltipV2 = require('../../../tokens/tooltip-v2.js');
var index = require('../../../hooks/use-floating/index.js');
var visualHidden = require('../../visual-hidden/src/visual-hidden.js');

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

exports["default"] = _sfc_main;
//# sourceMappingURL=content2.js.map