update: follow primevue's exposed element property naming convention

Author: connorabbas

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>

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>

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>

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>

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>

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>

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>

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>
 

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>