"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const Vue = require("vue");
const index = require("../badge/index.js");
const props = require("../utils/props.js");
const create = require("../utils/create.js");
const basic = require("../utils/basic.js");
const [name, bem] = create.createNamespace("tab");
const TabTitle = Vue.defineComponent({
  name,
  props: {
    id: String,
    dot: Boolean,
    type: String,
    color: String,
    title: String,
    badge: props.numericProp,
    shrink: Boolean,
    isActive: Boolean,
    disabled: Boolean,
    controls: String,
    scrollable: Boolean,
    activeColor: String,
    inactiveColor: String,
    showZeroBadge: props.truthProp
  },
  setup(props2, {
    slots
  }) {
    const style = Vue.computed(() => {
      const style2 = {};
      const {
        type,
        color,
        disabled,
        isActive,
        activeColor,
        inactiveColor
      } = props2;
      const isCard = type === "card";
      if (color && isCard) {
        style2.borderColor = color;
        if (!disabled) {
          if (isActive) {
            style2.backgroundColor = color;
          } else {
            style2.color = color;
          }
        }
      }
      const titleColor = isActive ? activeColor : inactiveColor;
      if (titleColor) {
        style2.color = titleColor;
      }
      return style2;
    });
    const renderText = () => {
      const Text = Vue.createVNode("span", {
        "class": bem("text", {
          ellipsis: !props2.scrollable
        })
      }, [slots.title ? slots.title() : props2.title]);
      if (props2.dot || basic.isDef(props2.badge) && props2.badge !== "") {
        return Vue.createVNode(index.Badge, {
          "dot": props2.dot,
          "content": props2.badge,
          "showZero": props2.showZeroBadge
        }, {
          default: () => [Text]
        });
      }
      return Text;
    };
    return () => Vue.createVNode("div", {
      "id": props2.id,
      "role": "tab",
      "class": [bem([props2.type, {
        grow: props2.scrollable && !props2.shrink,
        shrink: props2.shrink,
        active: props2.isActive,
        disabled: props2.disabled
      }])],
      "style": style.value,
      "tabindex": props2.disabled ? void 0 : props2.isActive ? 0 : -1,
      "aria-selected": props2.isActive,
      "aria-disabled": props2.disabled || void 0,
      "aria-controls": props2.controls,
      "data-allow-mismatch": "attribute"
    }, [renderText()]);
  }
});
exports.TabTitle = TabTitle;
