<template>
  <button
    :disabled="isDisabled"
    :aria-disabled="isDisabled"
    class="btn btn-primary d-flex align-items-center"
    v-on:click="showLoader()"
    v-bind:class="[this.isLoading ? 'button-loader' : 'not-loading']"
  >
    {{ this.buttonText }}
  </button>
</template>

<script>
export default {
  name: "buttonPrimary",
  props: {
    buttonText: String,
    isDisabled: Boolean,
  },
  data() {
    return {
      isLoading: false,
    };
  },
  methods: {
    showLoader() {
      this.isLoading = true;
    },
  },
};
</script>
