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