'use strict';

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

var vue = require('vue');
require('../../../utils/index.js');
var tooltip = require('./tooltip.js');
var createNamespace = require('../../../utils/create-namespace.js');
var addUnit = require('../../../utils/add-unit.js');

"use strict";
var _sfc_main = /* @__PURE__ */ vue.defineComponent({
  ...{ name: "LlTooltip" },
  __name: "tooltip",
  props: tooltip.tooltipProps,
  setup(__props) {
    const props = __props;
    const attrs = vue.useAttrs();
    const bem = createNamespace.createNamespace("tooltip");
    const bemContainer = createNamespace.createNamespace("container-tooltip");
    const getIsWhiteBg = vue.computed(
      () => props.isWhiteBg && !props.bgColor && !props.textColor ? "is-white-bg" : ""
    );
    const getContainerClass = vue.computed(() => {
      const ellipsisClass = props.ellipsis ? bemContainer.m("ellipsis") : "";
      return `${bemContainer.b()} ${ellipsisClass}`;
    });
    const getContainerStyle = vue.computed(() => {
      const width = addUnit.addUnit(props.width);
      return {
        width: width ? width : "",
        ...props.containerStyle
      };
    });
    const getOverlayClass = vue.computed(() => {
      const ellipsisClass = props.tipEllipsis ? bem.m("ellipsis") : "";
      return `${bem.b()} ${ellipsisClass} ${props.overlayClassName}`;
    });
    const getOverlayStyle = vue.computed(() => {
      const maxWidth = addUnit.addUnit(props.maxWidth);
      return {
        WebkitLineClamp: props.tipEllipsis ? props.tipEllipsisLine : "none",
        "max-width": maxWidth,
        color: props.textColor || "#fff",
        ...props.overlayStyle
      };
    });
    const useEllipsis = vue.computed(() => {
      return !!props.ellipsis || !!addUnit.addUnit(props.width);
    });
    return (_ctx, _cache) => {
      const _component_ll_html = vue.resolveComponent("ll-html");
      const _component_ll_icon = vue.resolveComponent("ll-icon");
      const _component_a_tooltip = vue.resolveComponent("a-tooltip");
      return vue.openBlock(), vue.createBlock(_component_a_tooltip, vue.mergeProps(vue.unref(attrs), {
        placement: _ctx.placement,
        arrow: props.arrow,
        color: _ctx.bgColor,
        "overlay-style": getOverlayStyle.value,
        "overlay-class-name": `${getOverlayClass.value} ${getIsWhiteBg.value} ${!!_ctx.bgColor || !!_ctx.textColor ? "custom-color" : ""}`
      }), {
        title: vue.withCtx(() => [
          vue.renderSlot(_ctx.$slots, "title", {}, () => [
            vue.createVNode(_component_ll_html, { value: _ctx.tip }, null, 8, ["value"])
          ])
        ]),
        default: vue.withCtx(() => [
          useEllipsis.value || _ctx.showContainer ? (vue.openBlock(), vue.createElementBlock(
            "div",
            {
              key: 0,
              class: vue.normalizeClass(getContainerClass.value),
              style: vue.normalizeStyle(getContainerStyle.value)
            },
            [
              vue.renderSlot(_ctx.$slots, "default", {}, () => [
                vue.createVNode(_component_ll_icon, { "icon-name": "icon-question" })
              ])
            ],
            6
            /* CLASS, STYLE */
          )) : vue.renderSlot(_ctx.$slots, "default", { key: 1 }, () => [
            vue.createVNode(_component_ll_icon, { "icon-name": "icon-question" })
          ])
        ]),
        _: 3
        /* FORWARDED */
      }, 16, ["placement", "arrow", "color", "overlay-style", "overlay-class-name"]);
    };
  }
});

exports.default = _sfc_main;
//# sourceMappingURL=tooltip.vue2.js.map
