refactor: remove unused inheritRef option

This is technically a breaking change, but the option was not meant for public use
and ended up not solving the problem it was introduced for.

packages/runtime-core/src/component.ts

@@ -86,7 +86,6 @@ export interface FunctionalComponent<
   props?: ComponentPropsOptions<P>
   emits?: E | (keyof E)[]
   inheritAttrs?: boolean
-  inheritRef?: boolean
   displayName?: string
 }
 

packages/runtime-core/src/componentOptions.ts

@@ -105,7 +105,6 @@ export interface ComponentOptionsBase<
   components?: Record<string, PublicAPIComponent>
   directives?: Record<string, Directive>
   inheritAttrs?: boolean
-  inheritRef?: boolean
   emits?: E | EE[]
 
   // Internal ------------------------------------------------------------------

packages/runtime-core/src/componentRenderUtils.ts

@@ -180,10 +180,6 @@ export function renderComponentRoot(
       }
       root.transition = vnode.transition
     }
-    // inherit ref
-    if (Component.inheritRef && vnode.ref != null) {
-      root.ref = vnode.ref
-    }
 
     if (__DEV__ && setRoot) {
       setRoot(root)

packages/runtime-core/src/components/BaseTransition.ts

@@ -108,8 +108,6 @@ export function useTransitionState(): TransitionState {
 const BaseTransitionImpl = {
   name: `BaseTransition`,
 
-  inheritRef: true,
-
   props: {
     mode: String,
     appear: Boolean,
@@ -135,11 +133,11 @@ const BaseTransitionImpl = {
     const instance = getCurrentInstance()!
     const state = useTransitionState()
 
+    let prevTransitionKey: any
+
     return () => {
-      const children = slots.default && getTransitionRawChildren(
+      const children =
-        slots.default(),
+        slots.default && getTransitionRawChildren(slots.default(), true)
-        true
-      )
       if (!children || !children.length) {
         return
       }
@@ -183,11 +181,24 @@ const BaseTransitionImpl = {
 
       const oldChild = instance.subTree
       const oldInnerChild = oldChild && getKeepAliveChild(oldChild)
+
+      let transitionKeyChanged = false
+      const { getTransitionKey } = innerChild.type as any
+      if (getTransitionKey) {
+        const key = getTransitionKey()
+        if (prevTransitionKey === undefined) {
+          prevTransitionKey = key
+        } else if (key !== prevTransitionKey) {
+          prevTransitionKey = key
+          transitionKeyChanged = true
+        }
+      }
+
       // handle mode
       if (
         oldInnerChild &&
         oldInnerChild.type !== Comment &&
-        !isSameVNodeType(innerChild, oldInnerChild)
+        (!isSameVNodeType(innerChild, oldInnerChild) || transitionKeyChanged)
       ) {
         const leavingHooks = resolveTransitionHooks(
           oldInnerChild,

packages/runtime-core/src/renderer.ts

@@ -17,8 +17,7 @@ import {
   ComponentInternalInstance,
   createComponentInstance,
   Data,
-  setupComponent,
+  setupComponent
-  Component
 } from './component'
 import {
   renderComponentRoot,
@@ -283,14 +282,10 @@ export const setRef = (
   if (!vnode) {
     value = null
   } else {
-    const { el, component, shapeFlag, type } = vnode
+    if (vnode.shapeFlag & ShapeFlags.STATEFUL_COMPONENT) {
-    if (shapeFlag & ShapeFlags.COMPONENT && (type as Component).inheritRef) {
+      value = vnode.component!.proxy
-      return
-    }
-    if (shapeFlag & ShapeFlags.STATEFUL_COMPONENT) {
-      value = component!.proxy
     } else {
-      value = el
+      value = vnode.el
     }
   }
 

packages/runtime-dom/src/components/Transition.ts

@@ -34,7 +34,6 @@ export const Transition: FunctionalComponent<TransitionProps> = (
   { slots }
 ) => h(BaseTransition, resolveTransitionProps(props), slots)
 
-Transition.inheritRef = true
 Transition.displayName = 'Transition'
 
 const DOMTransitionPropsValidators = {