shadcn-vue/apps/www/src/lib/registry/default/ui/avatar/Avatar.vue
2023-08-29 22:17:28 +02:00

34 lines
701 B
Vue

<script setup lang="ts">
import { AvatarRoot as AvatarRootPrimitive, type AvatarRootProps } from 'radix-vue'
import { computed, useAttrs } from 'vue'
import { cn } from '@/utils'
defineOptions({
name: 'Avatar',
inheritAttrs: false,
})
const props = defineProps<AvatarRootProps>()
const allAttrs = useAttrs()
const attrs = computed(() => {
const { class: className, ...rest } = allAttrs
return {
className,
rest,
}
})
</script>
<template>
<AvatarRootPrimitive
:class="cn(
'relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full',
attrs.className ?? '',
)"
v-bind="{ ...attrs.rest, ...props }"
>
<slot />
</AvatarRootPrimitive>
</template>