<template>
  <button
    id="LiveFormId"
    type="button"
    class="btn btn-lg btn-block"
    style="height: 50px"
    :style="{'background-color' : widget.style.buttoncolor, 'color' : widget.style.buttonTextColor, 'border' : widget.style.ButtonBorder+'px solid '+widget.style.ButtonBorderColor}"
    @click="$emit('submit')"
    v-on:change="buttonloader.submit = true"
    :disabled="buttonloader.submit"
  >
    <span v-if="buttonloader.submit == false">{{widget.text.buttonText}}</span>
    <span v-if="buttonloader.submit == true">
      <b-spinner small type="grow"></b-spinner>Loading...
    </span>
  </button>
</template>

<script>
export default {
  name: "submitBtn",
  data: function() {
    return {
      buttonloader: {
        submit: false
      },
      inputText: "",
      hover: false,
      highlight: false,
      top: false,
      bottom: false
    };
  },
  props: { widget: Object }
};
</script>