/**
 * ldesign v0.2.14
 * (c) 2022/11/2 16:16 built by swimly
 * @license MIT
 */

'use strict';

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

var iconsVue = require('@ldesign/icons-vue');
var utils_mixins = require('../../utils/mixins.js');
var utils_event = require('../../utils/event.js');
var utils_ripple = require('../../utils/ripple.js');
var components_configProvider_configReceiver = require('../config-provider/config-receiver.js');
var components_tabs_props = require('./props.js');
require('vue');
require('../../utils/helper.js');
require('lodash/camelCase');
require('../../chunks/set-style.js');
require('../../config.js');
require('lodash/mergeWith');
require('lodash');
require('../config-provider/context.js');
require('../../chunks/zh_CN.js');

var LTabNavItem = utils_mixins["default"](components_configProvider_configReceiver.getKeepAnimationMixins(), components_configProvider_configReceiver.getClassPrefixMixins("tab-nav__item"), components_configProvider_configReceiver.getGlobalIconMixins()).extend({
  name: "LTabNavItem",
  directives: {
    ripple: utils_ripple["default"]
  },
  props: {
    index: Number,
    active: {
      type: Boolean
    },
    theme: components_tabs_props.TabsProps.theme,
    size: components_tabs_props.TabsProps.size,
    placement: components_tabs_props.TabsProps.placement,
    label: {
      type: null
    },
    disabled: components_tabs_props.TabsPanelProps.disabled,
    removable: components_tabs_props.TabsPanelProps.removable,
    value: components_tabs_props.TabsPanelProps.value
  },
  computed: {
    navItemClass() {
      const {
        commonSizeClassName: SIZE,
        commonStatusClassName: STATUS
      } = this;
      return {
        [`${this.classPrefix}-tabs__nav-item`]: true,
        [`${this.classPrefix}-tabs__nav--card`]: this.theme === "card",
        [STATUS.disabled]: this.disabled,
        [`${this.classPrefix}-is-active`]: this.active,
        [`${this.classPrefix}-is-left`]: this.placement === "left",
        [`${this.classPrefix}-is-right`]: this.placement === "right",
        [SIZE.medium]: this.size === "medium",
        [SIZE.large]: this.size === "large"
      };
    }
  },
  methods: {
    removeBtnClick(e) {
      e.stopPropagation();
      utils_event.emitEvent(this, "remove", {
        e,
        value: this.value,
        index: this.index
      });
    },
    onClickNav(e) {
      if (this.disabled) return;
      e.stopPropagation();
      utils_event.emitEvent(this, "click", e);
    },
    renderCardItem() {
      const h = this.$createElement;
      const {
        CloseIcon
      } = this.useGlobalIcon({
        CloseIcon: iconsVue.CloseIcon
      });
      return h("div", {
        "class": this.navItemClass,
        "on": {
          "click": this.onClickNav
        },
        "directives": [{
          name: "ripple",
          value: this.keepAnimation.ripple
        }]
      }, [h("span", {
        "class": `${this.classPrefix}-tabs__nav-item-text-wrapper`
      }, [this.label]), this.removable && !this.disabled ? h(CloseIcon, {
        "class": "remove-btn",
        "nativeOn": {
          "click": this.removeBtnClick
        }
      }) : null]);
    },
    renderNormalItem() {
      const h = this.$createElement;
      const {
        CloseIcon
      } = this.useGlobalIcon({
        CloseIcon: iconsVue.CloseIcon
      });
      return h("div", {
        "class": this.navItemClass,
        "on": {
          "click": this.onClickNav
        }
      }, [h("div", {
        "class": [`${this.classPrefix}-tabs__nav-item-wrapper`, {
          [`${this.classPrefix}-is-disabled`]: this.disabled,
          [`${this.classPrefix}-is-active`]: this.active
        }],
        "directives": [{
          name: "ripple",
          value: this.keepAnimation.ripple
        }]
      }, [h("span", {
        "class": `${this.classPrefix}-tabs__nav-item-text-wrapper`
      }, [this.label])]), this.removable && !this.disabled ? h(CloseIcon, {
        "class": "remove-btn",
        "nativeOn": {
          "click": this.removeBtnClick
        }
      }) : null]);
    }
  },
  render() {
    return this.theme === "card" ? this.renderCardItem() : this.renderNormalItem();
  }
});

exports["default"] = LTabNavItem;
//# sourceMappingURL=tab-nav-item.js.map
