Cacher is the code snippet organizer for pro developers

<template>
  <nuxt-link
    v-if="type === 'nuxt'"
    :to="link"
    :class="['c-Btn', modifier]"
  >
    {{ label }}
  </nuxt-link>
  <a
    v-else-if="type === 'external'"
    :href="link"
    target="_blank"
    :class="['c-Btn', modifier]"
  >
    {{ label }}
  </a>
  <button
    v-else-if="type === 'button'"
    :class="['c-Btn', modifier]"
  >
    {{ label }}
  </button>
</template>

<script>
export default {
  name: 'Button',
  props: {
    label: {
      type: String,
      required: true
    },
    modifier: {
      type: String,
      default: null
    },
    link: {
      type: String,
      required: false,
      default: null
    },
    type: {
      type: String, // Expects one of ['nuxt', 'external', 'button']
      required: true,
      default: 'nuxt'
    }
  }
}
</script>

<style lang="scss" scoped>
  .Button {
  }
</style>