1// Return the existing ref as is
2toRef(existingRef)
3
4// Create a read-only ref that will be called when .value is accessed.
5toRef(() => props.foo)
6
7// Create a normal ref from a non-function value. Equivalent to ref(1).
8toRef(1)
9
10// Convert reactive object properties
11const state = reactive({
12  foo: 1, bar: 2
13  bar: 2
14})
15
16const fooRef = toRef(state, ‘foo’)

1export function toRef(
2  source: Record<string, any> | MaybeRef,
3  key?: string,
4  defaultValue?: unknown,
5): Ref {
6  if (isRef(source)) {
7    return source
8  } else if (isFunction(source)) {
9    return new GetterRefImpl(source) as any
10  } else if (isObject(source) && arguments.length > 1) {
11    return propertyToRef(source, key!, defaultValue)
12  } else {
13    return ref(source)
14  }
15}

1class GetterRefImpl<T> {
2  public readonly __v_isRef = true
3  public readonly __v_isReadonly = true
4  constructor(private readonly _getter: () => T) {}
5  get value() {
6    return this._getter()
7  }
8}

1function propertyToRef(
2  source: Record<string, any>,
3  key: string,
4  defaultValue?: unknown,
5) {
6  const val = source[key]
7  return isRef(val)
8    ? val
9    : (new ObjectRefImpl(source, key, defaultValue) as any)
10}
11
12class ObjectRefImpl<T extends object, K extends keyof T> {
13  public readonly __v_isRef = true
14
15  constructor(
16    private readonly _object: T,
17    private readonly _key: K,
18    private readonly _defaultValue?: T[K],
19  ) {}
20
21  get value() {
22    const val = this._object[this._key]
23    return val === undefined ? this._defaultValue! : val
24  }
25
26  set value(newVal) {
27    this._object[this._key] = newVal
28  }
29
30  get dep(): Dep | undefined {
31    /// ...
32  }
33}