<template>
  <b-field class="column mb-0 pb-0 mx-0 px-0" label="Letra" :class="columnSize">
    <b-input
      icon="alphabetical"
      maxlength="1"
      type="text"
      :has-counter="false"
      @keyup.enter.native="ejecutar()"
      v-model="letra"
      rounded
    />
  </b-field>
</template>

<script>
export default {
  props: {
    ejecutar: { typeof: Function, required: true, default: () => {} },
    letraPadre: { typeof: String, required: true, default: '' },
    columnSize: { typeof: String, required: false, default: '' },
  },
  data: () => {
    return { letra: 'C' }
  },
  watch: {
    letra() {
      this.$emit('letra', this.letra)
    },
    letraPadre() {
      this.letra = this.letraPadre
    },
  },
  created() {
    if (this.letraPadre) this.letra = this.letraPadre
  },
}
</script>

<style scoped></style>
