<template>
  <div v-show="showHelp" class="px-4 bg-gray-50 py-1.5 text-gray-400">
    <QuestionCircleOutlined/>
    <span class=" px-2">{{ message }}</span>
    <CloseOutlined class="ml-4" @click="() => showHelp = false"/>
  </div>
</template>

<script lang="ts" setup>
import {ref} from 'vue';
import {CloseOutlined, QuestionCircleOutlined} from "@ant-design/icons-vue";

withDefaults(
  defineProps<{
    title: string;
    message: string;
  }>(),
  {}
);

const showHelp = ref(true);

</script>
