<template>
  <component :is="activeName" />
</template>

<script>
import List from './components/list'
import Add from './components/add'

export default {
  components: {
    List: List,
    Add: Add
  },
  data() {
    return {
      activeName: 'List',
      heirloom: {}
    }
  },
  methods: {
    setActiveName(activeName) {
      this.activeName = activeName
    }
  },
  provide() {
    return {
      setActiveName: this.setActiveName
    }
  }
}
</script>

<style scoped>
</style>
