fix(VTooltip): disable transition when transition=false

fixes #21268

Author: KaelWD

packages/vuetify/src/components/VDialog/VDialog.tsx

@@ -17,7 +17,6 @@ import { mergeProps, nextTick, onBeforeUnmount, ref, watch } from 'vue'
 import { focusableChildren, genericComponent, IN_BROWSER, propsFactory, useRender } from '@/util'
 
 // Types
-import type { Component } from 'vue'
 import type { OverlaySlots } from '@/components/VOverlay/VOverlay'
 
 export const makeVDialogProps = propsFactory({
@@ -31,7 +30,7 @@ export const makeVDialogProps = propsFactory({
   ...makeVOverlayProps({
     origin: 'center center' as const,
     scrollStrategy: 'block' as const,
-    transition: { component: VDialogTransition as Component },
+    transition: { component: VDialogTransition },
     zIndex: 2400,
   }),
 }, 'VDialog')

packages/vuetify/src/components/VMenu/VMenu.tsx

@@ -41,7 +41,6 @@ import {
 } from '@/util'
 
 // Types
-import type { Component } from 'vue'
 import type { OverlaySlots } from '@/components/VOverlay/VOverlay'
 
 export const makeVMenuProps = propsFactory({
@@ -58,7 +57,7 @@ export const makeVMenuProps = propsFactory({
     openDelay: 300,
     scrim: false,
     scrollStrategy: 'reposition' as const,
-    transition: { component: VDialogTransition as Component },
+    transition: { component: VDialogTransition },
   }), ['absolute']),
 }, 'VMenu')
 

packages/vuetify/src/components/VTooltip/VTooltip.tsx

@@ -35,7 +35,7 @@ export const makeVTooltipProps = propsFactory({
     origin: 'auto' as const,
     scrim: false,
     scrollStrategy: 'reposition' as const,
-    transition: false,
+    transition: null,
   }), [
     'absolute',
     'persistent',
@@ -77,7 +77,7 @@ export const VTooltip = genericComponent<OverlaySlots>()({
     })
 
     const transition = toRef(() => {
-      if (props.transition) return props.transition
+      if (props.transition != null) return props.transition
       return isActive.value ? 'scale-transition' : 'fade-transition'
     })
 

packages/vuetify/src/composables/transition.ts

@@ -1,20 +1,20 @@
 // Utilities
 import { h, mergeProps, Transition, TransitionGroup } from 'vue'
-import { propsFactory } from '@/util'
+import { isObject, propsFactory } from '@/util'
 
 // Types
-import type { Component, FunctionalComponent, PropType, TransitionProps } from 'vue'
+import type { Component, FunctionalComponent, Prop, TransitionProps } from 'vue'
 
 export const makeTransitionProps = propsFactory({
   transition: {
-    type: [Boolean, String, Object] as PropType<string | boolean | TransitionProps & { component?: Component }>,
+    type: null,
     default: 'fade-transition',
     validator: val => val !== true,
-  },
+  } as Prop<null | string | boolean | TransitionProps & { component?: Component }>,
 }, 'transition')
 
 interface MaybeTransitionProps extends TransitionProps {
-  transition?: string | boolean | TransitionProps & { component?: any }
+  transition?: null | string | boolean | TransitionProps & { component?: any }
   disabled?: boolean
   group?: boolean
 }
@@ -25,19 +25,25 @@ export const MaybeTransition: FunctionalComponent<MaybeTransitionProps> = (props
   const {
     component = group ? TransitionGroup : Transition,
     ...customProps
-  } = typeof transition === 'object' ? transition : {}
+  } = isObject(transition) ? transition : {}
+
+  let transitionProps
+  if (isObject(transition)) {
+    transitionProps = mergeProps(
+      customProps,
+      JSON.parse(JSON.stringify({ disabled, group })),
+      rest,
+    )
+  } else {
+    transitionProps = mergeProps(
+      { name: disabled || !transition ? '' : transition },
+      rest,
+    )
+  }
 
   return h(
     component,
-    mergeProps(
-      typeof transition === 'string'
-        ? { name: disabled ? '' : transition }
-        : customProps as any,
-      typeof transition === 'string'
-        ? {}
-        : Object.fromEntries(Object.entries({ disabled, group }).filter(([_, v]) => v !== undefined)),
-      rest as any,
-    ),
+    transitionProps,
     slots
   )
 }