feat(reactivity): enhance type inference for context-sensitive inputs

Author: jh-leong

packages/dts-test/reactivity.test-d.ts

@@ -1,4 +1,13 @@
-import { ref, readonly, shallowReadonly, Ref, reactive, markRaw } from 'vue'
+import {
+  ref,
+  readonly,
+  shallowReadonly,
+  Ref,
+  reactive,
+  markRaw,
+  ComputedRef,
+  computed
+} from 'vue'
 import { describe, expectType } from './utils'
 
 describe('should support DeepReadonly', () => {
@@ -62,3 +71,23 @@ describe('should unwrap tuple correctly', () => {
   const reactiveTuple = reactive(tuple)
   expectType<Ref<number>>(reactiveTuple[0])
 })
+
+// #1930
+describe('should unwrap the computed type', () => {
+  interface Bar {
+    a: number
+    b: (_: any) => void
+  }
+
+  const computedA: ComputedRef<number> = computed(() => 1)
+
+  expect<{ a: number }>(reactive({ a: computedA }))
+
+  expect<Bar>(
+    reactive({
+      a: computedA, // issue happens here, but is should be okay
+      // @ts-ignore
+      b: _ => {} // error depending on --noImplicitAny
+    })
+  )
+})

packages/reactivity/src/reactive.ts

@@ -64,6 +64,8 @@ function getTargetType(value: Target) {
 // only unwrap nested ref
 export type UnwrapNestedRefs<T> = T extends Ref ? T : UnwrapRefSimple<T>
 
+type NoInfer<T> = [T][T extends any ? 0 : never]
+
 /**
  * Returns a reactive proxy of the object.
  *
@@ -80,6 +82,9 @@ export type UnwrapNestedRefs<T> = T extends Ref ? T : UnwrapRefSimple<T>
  * @see {@link https://vuejs.org/api/reactivity-core.html#reactive}
  */
 export function reactive<T extends object>(target: T): UnwrapNestedRefs<T>
+export function reactive<T extends object>(
+  target: T
+): NoInfer<UnwrapNestedRefs<T>>
 export function reactive(target: object) {
   // if trying to observe a readonly proxy, return the readonly version.
   if (isReadonly(target)) {