<template>
  <div :class="_class">
    <!-- @slot content 内容 -->
    <slot />
  </div>
</template>

<script>
const name = 'hive-tabs-tabpane';

export default {
  name,
  props: {
    /**
     * tab 标签文字
     */
    label: {
      type: String,
      required: true
    },
    /**
     * tab 标签值
     */
    value: [String, Number],
    /**
     * 提示待处理
     */
    information: {
      type: Boolean,
      default: false
    },
    /**
     * 标签是否可关闭
     */
    closeTab: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      curValue: this.value
    };
  },
  inject: [
    'tabs'
  ],
  computed: {
    _class() {
      return [
        name,
        {
          [`${name}--active`]: this.curValue === this.tabs.curValue
        }
      ];
    }
  }
};
</script>
