<template>
  <div class="kole-alert kole-alert-alert" :class="'is-' + props.type" role="alert"><span><strong>{{ props.title }}</strong><br /><span class="kole-alert-desc">{{ props.description }}</span></span><button v-if="props.closable" class="kole-alert-close" type="button" aria-label="关闭" @click="emit('close')">×</button></div>
</template>

<script setup>
import { ref, computed } from 'vue';
const props = defineProps({
    type: { type: String, default: 'info' }, // 类型
    title: { type: String, default: '系统提示' }, // 标题
    description: { type: String, default: '请检查当前配置后继续。' }, // 描述文本
    closable: { type: Boolean, default: true }, // 是否可关闭
});
const emit = defineEmits(["close"]);


</script>

<style src="./Alert.css"></style>
