1<template>
2  <b-alert :show="show" :variant="variant" :class="{ small }">
3    <div
4      v-if="
5        variant == 'info' ||
6          variant == 'success' ||
7          variant == 'warning' ||
8          variant == 'danger'
9      "
10      class="alert-icon"
11    >
12      <status-icon :status="variant" />
13    </div>
14    <div class="alert-content">
15      <div class="alert-msg">
16        <slot />
17      </div>
18    </div>
19    <div class="alert-action">
20      <slot name="action"></slot>
21    </div>
22  </b-alert>
23</template>
24
25<script>
26import StatusIcon from '../Global/StatusIcon';
27import { BAlert } from 'bootstrap-vue';
28
29export default {
30  name: 'Alert',
31  components: {
32    BAlert: BAlert,
33    StatusIcon: StatusIcon
34  },
35  props: {
36    show: {
37      type: Boolean,
38      default: true
39    },
40    variant: {
41      type: String,
42      default: ''
43    },
44    small: Boolean
45  }
46};
47</script>
48