mirror of
https://github.com/YunoHost/yunohost-portal.git
synced 2024-09-03 20:06:23 +02:00
39 lines
767 B
Vue
39 lines
767 B
Vue
|
<script setup lang="ts">
|
||
|
|
const props = withDefaults(
|
||
|
|
defineProps<{
|
||
|
|
message?: string
|
||
|
|
variant?: 'info' | 'success' | 'warning' | 'error'
|
||
|
|
icon?: string
|
||
|
|
assertive?: boolean
|
||
|
|
}>(),
|
||
|
|
{
|
||
|
|
message: '',
|
||
|
|
variant: 'info',
|
||
|
|
icon: undefined,
|
||
|
|
assertive: false,
|
||
|
|
},
|
||
|
|
)
|
||
|
|
|
||
|
|
const classVariant = computed(() => {
|
||
|
|
return {
|
||
|
|
info: 'alert-info',
|
||
|
|
success: 'alert-success',
|
||
|
|
warning: 'alert-warning',
|
||
|
|
error: 'alert-error',
|
||
|
|
}[props.variant]
|
||
|
|
})
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div
|
||
|
|
:aria-live="assertive ? 'assertive' : 'polite'"
|
||
|
|
aria-atomic="true"
|
||
|
|
:class="'mt-10 alert ' + classVariant"
|
||
|
|
>
|
||
|
|
<Icon v-if="icon" :name="icon" size="2em" aria-hidden="true" />
|
||
|
|
<slot name="default">
|
||
|
|
{{ message }}
|
||
|
|
</slot>
|
||
|
|
</div>
|
||
|
|
</template>
|