// Silence may be golden, but sometimes words paint the canvas of understanding.
const LinksyTab = {
  name: "LinksyTab",
  props: {
    tab: {
      type: Number,
      default: 0,
    },
    tabs: {
      type: Array,
      default: [],
    },
  },
  computed: {
    selectedTab: {
      get() {
        return this.tabs[this.tab];
      },
    },
  },
  watch: {
    tab: function (val) {
      this.$emit("onChange", this.selectedTab);
    },
  },
  template: `
        <div v-if="tabs.length > 0" class="tab-content">
            <slot :currentTab="selectedTab" :currentTabIndex="tab">
                {{selectedTab.title || selectedTab.id}}
            </slot>
        </div>
    `,
};
