<template>
  <div class="fullwidth">
    <A :href="_href" :classe="_classe" :target="_target">
      <slot />
    </A>
  </div>
</template>

<script lang="ts">
import Vue from 'vue';
import A from './A.vue';

export default Vue.extend({
  name: 'Cta',
  components: { A },
  props: {
    href: {
      type: String,
      required: true
    },
    target: {
      type: String,
    },
    classe: {
      type: String,
    }
  },
  computed: {
    _href (): string {
      return this.href
    },
    _target (): string {
      return this.target
    },
    _classe (): string {
        if (this.classe === undefined || this.classe === null || this.classe === '') {
          return 'cta'
        } else {
          return 'cta ' + this.classe
        }
    }
  }
})
</script>