feat(Menu): support disabled state via disabled prop

brufdev · brufdev · commit 83d46514b501 · 2026-03-25T23:52:37.000Z
diff --git a/resources/js/components/menu/Menu.vue b/resources/js/components/menu/Menu.vue
@@ -5,6 +5,7 @@ type MenuType = 'dropdown' | 'hover';
 
 const props = defineProps<{
     type: MenuType;
+    disabled?: boolean;
 }>();
 
 const { triggerRef, menuRef, isOpen, position, closeMenu, toggleMenu } = useMenu();
@@ -18,7 +19,7 @@ function handleClick() {
 }
 
 function handleHover() {
-    if (props.type === 'hover') {
+    if (props.type === 'hover' && !props.disabled) {
         toggleMenu();
     }
 }
@@ -32,7 +33,7 @@ function handleHover() {
         @mouseenter="handleHover"
         @mouseleave="handleHover"
     >
-        <div class="cursor-pointer select-none">
+        <div :class="['select-none', !disabled && 'cursor-pointer']">
             <slot name="trigger" />
 
             <Teleport to="body" :disabled="props.type === 'hover'">

Original file line number	Diff line number	Diff line change
`@@ -5,6 +5,7 @@ type MenuType = 'dropdown' \| 'hover';`
`5`	`5`
`6`	`6`	`const props = defineProps<{`
`7`	`7`	`type: MenuType;`
	`8`	`+ disabled?: boolean;`
`8`	`9`	`}>();`
`9`	`10`
`10`	`11`	`const { triggerRef, menuRef, isOpen, position, closeMenu, toggleMenu } = useMenu();`
`@@ -18,7 +19,7 @@ function handleClick() {`
`18`	`19`	`}`
`19`	`20`
`20`	`21`	`function handleHover() {`
`21`		`- if (props.type === 'hover') {`
	`22`	`+ if (props.type === 'hover' && !props.disabled) {`
`22`	`23`	`toggleMenu();`
`23`	`24`	`}`
`24`	`25`	`}`
`@@ -32,7 +33,7 @@ function handleHover() {`
`32`	`33`	`@mouseenter="handleHover"`
`33`	`34`	`@mouseleave="handleHover"`
`34`	`35`	`>`
`35`		`- <div class="cursor-pointer select-none">`
	`36`	`+ <div :class="['select-none', !disabled && 'cursor-pointer']">`
`36`	`37`	`<slot name="trigger" />`
`37`	`38`
`38`	`39`	`<Teleport to="body" :disabled="props.type === 'hover'">`