diff --git a/resources/js/components/primevue/menu/Breadcrumb.vue b/resources/js/components/primevue/menu/Breadcrumb.vue
index 7d53bcd0..2668ce38 100644
--- a/resources/js/components/primevue/menu/Breadcrumb.vue
+++ b/resources/js/components/primevue/menu/Breadcrumb.vue
@@ -16,7 +16,7 @@ const defaultPt = ref<BreadcrumbPassThroughOptions>({
 
 type BreadcrumbType = InstanceType<typeof Breadcrumb>;
 const childRef = useTemplateRef<BreadcrumbType>('child-ref');
-defineExpose({ el: childRef });
+defineExpose({ $el: childRef });
 </script>
 
 <template>
diff --git a/resources/js/components/primevue/menu/ContextMenu.vue b/resources/js/components/primevue/menu/ContextMenu.vue
index 1078fb5e..99d94c97 100644
--- a/resources/js/components/primevue/menu/ContextMenu.vue
+++ b/resources/js/components/primevue/menu/ContextMenu.vue
@@ -14,7 +14,7 @@ type ContextMenuType = InstanceType<typeof ContextMenu>;
 const childRef = useTemplateRef<ContextMenuType>('child-ref');
 
 defineExpose({
-    el: childRef,
+    $el: childRef,
     toggle: (event: Event) => childRef.value?.toggle(event)
 });
 </script>
diff --git a/resources/js/components/primevue/menu/Menu.vue b/resources/js/components/primevue/menu/Menu.vue
index 53b77b03..5ec6fd91 100644
--- a/resources/js/components/primevue/menu/Menu.vue
+++ b/resources/js/components/primevue/menu/Menu.vue
@@ -13,7 +13,7 @@ type MenuType = InstanceType<typeof Menu>;
 const childRef = useTemplateRef<MenuType>('child-ref');
 
 defineExpose({
-    el: childRef,
+    $el: childRef,
     toggle: (event: Event) => childRef.value?.toggle(event)
 });
 </script>
diff --git a/resources/js/components/primevue/menu/Menubar.vue b/resources/js/components/primevue/menu/Menubar.vue
index f6479b9a..ff668d25 100644
--- a/resources/js/components/primevue/menu/Menubar.vue
+++ b/resources/js/components/primevue/menu/Menubar.vue
@@ -16,7 +16,7 @@ const componentProps = withDefaults(
 type MenubarType = InstanceType<typeof Menubar>;
 const childRef = useTemplateRef<MenubarType>('child-ref');
 
-defineExpose({ el: childRef });
+defineExpose({ $el: childRef });
 </script>
 
 <template>
diff --git a/resources/js/components/primevue/menu/PanelMenu.vue b/resources/js/components/primevue/menu/PanelMenu.vue
index 02c3015a..8bdb08c8 100644
--- a/resources/js/components/primevue/menu/PanelMenu.vue
+++ b/resources/js/components/primevue/menu/PanelMenu.vue
@@ -19,7 +19,7 @@ const defaultPt: PanelMenuPassThroughOptions = {
 
 type PanelMenuType = InstanceType<typeof PanelMenu>;
 const childRef = useTemplateRef<PanelMenuType>('child-ref');
-defineExpose({ el: childRef });
+defineExpose({ $el: childRef });
 </script>
 
 <template>
diff --git a/resources/js/components/primevue/menu/TabMenu.vue b/resources/js/components/primevue/menu/TabMenu.vue
index 0454b9ba..f4cb43d1 100644
--- a/resources/js/components/primevue/menu/TabMenu.vue
+++ b/resources/js/components/primevue/menu/TabMenu.vue
@@ -24,9 +24,7 @@ const currentRoute = computed(() => {
 
 type TabsType = InstanceType<typeof Tabs>;
 const childRef = useTemplateRef<TabsType>('child-ref');
-defineExpose({
-    el: childRef,
-});
+defineExpose({ $el: childRef });
 </script>
 
 <template>
diff --git a/resources/js/components/primevue/menu/TieredMenu.vue b/resources/js/components/primevue/menu/TieredMenu.vue
index 2b451e57..dd7e5b4e 100644
--- a/resources/js/components/primevue/menu/TieredMenu.vue
+++ b/resources/js/components/primevue/menu/TieredMenu.vue
@@ -13,9 +13,7 @@ const componentProps = defineProps<ExtendedTieredMenuProps>();
 type TieredMenuType = InstanceType<typeof TieredMenu>;
 const childRef = useTemplateRef<TieredMenuType>('child-ref');
 
-defineExpose({
-    el: childRef,
-});
+defineExpose({ $el: childRef });
 </script>
 
 <template>
diff --git a/resources/js/layouts/app/HeaderLayout.vue b/resources/js/layouts/app/HeaderLayout.vue
index 2021edcf..8a661057 100644
--- a/resources/js/layouts/app/HeaderLayout.vue
+++ b/resources/js/layouts/app/HeaderLayout.vue
@@ -29,12 +29,12 @@ const {
 
 const userMenu = useTemplateRef('user-menu');
 const toggleUserMenu = (event) => {
-    userMenu.value.el.toggle(event);
+    userMenu.value.$el.toggle(event);
 };
 
 const mobileUserMenu = useTemplateRef('mobile-user-menu');
 const toggleMobileUserMenu = (event) => {
-    mobileUserMenu.value.el.toggle(event);
+    mobileUserMenu.value.$el.toggle(event);
 };
 </script>
 
diff --git a/resources/js/layouts/app/SidebarLayout.vue b/resources/js/layouts/app/SidebarLayout.vue
index 619f1916..3622b6da 100644
--- a/resources/js/layouts/app/SidebarLayout.vue
+++ b/resources/js/layouts/app/SidebarLayout.vue
@@ -27,12 +27,12 @@ const {
 
 const userMenu = useTemplateRef('user-menu');
 const toggleUserMenu = (event) => {
-    userMenu.value.el.toggle(event);
+    userMenu.value.$el.toggle(event);
 };
 
 const mobileUserMenu = useTemplateRef('mobile-user-menu');
 const toggleMobileUserMenu = (event) => {
-    mobileUserMenu.value.el.toggle(event);
+    mobileUserMenu.value.$el.toggle(event);
 };
 </script>
 
diff --git a/resources/js/pages/admin/users/Index.vue b/resources/js/pages/admin/users/Index.vue
index 43dbdbce..28aa1acb 100644
--- a/resources/js/pages/admin/users/Index.vue
+++ b/resources/js/pages/admin/users/Index.vue
@@ -35,8 +35,8 @@ function toggleUserContextMenu(event, userData) {
         },
     ];
     // Show the menu
-    if (userContextMenu.value && userContextMenu.value?.el) {
-        userContextMenu.value.el.toggle(event);
+    if (userContextMenu.value && userContextMenu.value?.$el) {
+        userContextMenu.value.$el.toggle(event);
     }
 }