2022-12-11 10:52:36 +00:00
|
|
|
<script lang="ts" setup>
|
2023-01-01 22:06:27 +00:00
|
|
|
const emit = defineEmits<{
|
2022-12-11 10:52:36 +00:00
|
|
|
(event: 'close'): void
|
|
|
|
|
}>()
|
2023-04-12 12:35:35 +00:00
|
|
|
const { modelValue: visible } = defineModels<{
|
2023-01-06 15:46:36 +00:00
|
|
|
modelValue?: boolean
|
|
|
|
|
}>()
|
2022-12-11 10:52:36 +00:00
|
|
|
|
|
|
|
|
function close() {
|
2023-01-01 22:06:27 +00:00
|
|
|
emit('close')
|
2022-12-11 10:52:36 +00:00
|
|
|
visible.value = false
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<template>
|
|
|
|
|
<div
|
|
|
|
|
flex="~ gap-2" justify-between items-center
|
2022-12-27 22:18:16 +00:00
|
|
|
border="b base" text-sm text-secondary px4 py2 sm:py4
|
2022-12-11 10:52:36 +00:00
|
|
|
>
|
|
|
|
|
<div>
|
|
|
|
|
<slot />
|
|
|
|
|
</div>
|
2023-01-12 09:40:49 +00:00
|
|
|
<button text-xl hover:text-primary bg-hover-overflow w="1.2em" h="1.2em" @click="close()">
|
2022-12-11 10:52:36 +00:00
|
|
|
<div i-ri:close-line />
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
