diff --git a/packages/elements/src/message/MessageAttachments.vue b/packages/elements/src/message/MessageAttachments.vue
index c9c6a7b..09e6f0c 100644
--- a/packages/elements/src/message/MessageAttachments.vue
+++ b/packages/elements/src/message/MessageAttachments.vue
@@ -1,20 +1,17 @@
 <script setup lang="ts">
 import type { HTMLAttributes } from 'vue'
 import { cn } from '@repo/shadcn-vue/lib/utils'
-import { useSlots } from 'vue'
 
 interface Props {
   class?: HTMLAttributes['class']
 }
 
 const props = defineProps<Props>()
-
-const slots = useSlots()
 </script>
 
 <template>
   <div
-    v-if="slots.default"
+    v-if="$slots?.default"
     :class="
       cn(
         'ml-auto flex w-fit flex-wrap items-start gap-2',
diff --git a/packages/elements/src/message/MessageAvatar.vue b/packages/elements/src/message/MessageAvatar.vue
index 16159a1..7c1592a 100644
--- a/packages/elements/src/message/MessageAvatar.vue
+++ b/packages/elements/src/message/MessageAvatar.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import type { HTMLAttributes } from 'vue'
 import { Avatar, AvatarFallback, AvatarImage } from '@repo/shadcn-vue/components/ui/avatar'
-import { computed, useAttrs } from 'vue'
+import { computed } from 'vue'
 
 interface Props {
   src: string
@@ -10,13 +10,12 @@ interface Props {
 }
 
 const props = defineProps<Props>()
-const attrs = useAttrs()
 
 const fallbackText = computed(() => props.name?.slice(0, 2) ?? 'ME')
 </script>
 
 <template>
-  <Avatar class="size-8 ring-1 ring-border" :class="[props.class]" v-bind="attrs">
+  <Avatar class="size-8 ring-1 ring-border" :class="[props.class]" v-bind="$attrs">
     <AvatarImage alt="" class="mt-0 mb-0" :src="props.src" />
     <AvatarFallback>{{ fallbackText }}</AvatarFallback>
   </Avatar>