text: 
  /**
   * First we will load all of this project's JavaScript dependencies which
   * includes Vue and other libraries. It is a great starting point when
   * building robust, powerful web applications using Vue and Laravel.
   */
  
  require('./bootstrap');
  
  /**
   * Next, we will create a fresh Vue application instance and attach it to
   * the page. Then, you may begin adding components to this application
   * or customize the JavaScript scaffolding to fit your unique needs.
   */
  
  Vue.component('example', require('./components/Example.vue'));
  
  Vue.component('tabs', {
      template: `
          <div>
              <div class="tabs is-centered">
                  <ul>
                      <li v-for="tab in tabs" :class="{ 'is-active': tab.isActive }">
                          <a :href="tab.href" @click="selectTab(tab)">{{ tab.name }}</a>
                      </li>
                  </ul>
              </div>
              <div class="tabs-details">
                  <slot></slot>
              </div>
          </div>
      `,
  
      data() {
          return { tabs: [] };
      },
  
      created() {
          this.tabs = this.$children;
      },
  
      methods: {
          selectTab(selectedTab) {
              this.tabs.forEach(tab => {
                  tab.isActive = (tab.href == selectedTab.href);
              });
          }
      }
  });
  
  
  Vue.component('tab', {
      template: `
          <div v-show="isActive"><slot></slot></div>
      `,
  
      props: {
          name: { required: true },
          selected: { default: false }
      },
  
      data() {
          return {
              isActive: false
          };
      },
  
      computed: {
          href() {
              return '#' + this.name.toLowerCase().replace(/ /g, '-');
          }
      },
  
      mounted() {
          this.isActive = this.selected;
      },
  });
  
  
  const app = new Vue({
      el: '#app'
  });
  