import Vue from 'vue'

export default Vue.extend({
  name: 'SntTabs',
  props: {
    value: {
      type: String,
      default: null
    }
  },
  data () {
    return {
      tab: this.value
    }
  },
  watch: {
    value () {
      this.tab = this.value
    }
  },
  methods: {
    isTabSelected (tab) {
      return this.tab === tab
    },
    selectTab (tab) {
      this.tab = tab
    }
  },
  template: `
    <div class="snt-tabs">
      <slot
        :selectTab="selectTab"
        :isTabSelected="isTabSelected" />
    </div>
  `
})
