blob: 82f693d8306ab271bd6dc1e2bab165d599d3c790 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
|
<script setup>
import {$gettext} from "../../../assets/javascripts/lib/gettext";
import Dropdown from "../Dropdown.vue";
import UserAvatar from "../UserAvatar.vue";
defineProps({
user: {
type: Object,
required: true
},
size: {
type: String,
default: '25px',
},
label: {
type: String,
default: ''
}
});
const isOpen = defineModel({ default: false });
</script>
<template>
<Dropdown class="user-avatar-dropdown" v-model="isOpen">
<template #trigger>
<button
class="user-avatar-dropdown__preview"
@click="isOpen = !isOpen"
v-bind="$attrs"
:class="{
'active': isOpen
}"
:title="label ?? user.name"
:aria-label="label ?? $gettext('vCard')"
:aria-pressed="isOpen"
>
<img class="user-profile" :src="user.avatar_url" :style="{ width: size, height: size }" :alt="user.name" />
</button>
</template>
<template #content>
<UserAvatar :user="user" v-model="isOpen" />
</template>
</Dropdown>
</template>
|
