fix(types): augment ref unwrap bail types in appropriate packages

Packages can now augment the ref unwrap bail types in their own `d.ts`.
Also updated the build script to auto concat any files in a package's
`types` directory to the final generated `d.ts`.

- `@vue/reactivity` should no longer require `libs: ["DOM"]` in tsconfig
- Properly bail on `VNode` and `ComponentPublicInstance` in runtime-core

diff --git a/packages/reactivity/src/index.ts b/packages/reactivity/src/index.ts
index bdfa64f6995e0b4e5a56824c48924da9eec0100e..1c9cf821834cd019cab9f3f23ef649e440c4e0a8 100644 (file)
--- a/packages/reactivity/src/index.ts
+++ b/packages/reactivity/src/index.ts
@@ -9,7 +9,8 @@ export {
   triggerRef,
   Ref,
   UnwrapRef,
-  ToRefs
+  ToRefs,
+  RefUnwrapBailTypes
 } from './ref'
 export {
   reactive,

diff --git a/packages/reactivity/src/ref.ts b/packages/reactivity/src/ref.ts
index 470cd41fcabc12778b87f34d1062147402f9ba6a..07a5fc85d28c022a1fba62bb85de9425baccf0a0 100644 (file)
--- a/packages/reactivity/src/ref.ts
+++ b/packages/reactivity/src/ref.ts
@@ -139,13 +139,37 @@ export function toRef<T extends object, K extends keyof T>(
 // corner case when use narrows type
 // Ex. type RelativePath = string & { __brand: unknown }
 // RelativePath extends object -> true
-type BaseTypes = string | number | boolean | Node | Window
+type BaseTypes = string | number | boolean
+
+/**
+ * This is a special exported interface for other packages to declare
+ * additional types that should bail out for ref unwrapping. For example
+ * \@vue/runtime-dom can declare it like so in its d.ts:
+ *
+ * ``` ts
+ * declare module '@vue/reactivity' {
+ *   export interface RefUnwrapBailTypes {
+ *     runtimeDOMBailTypes: Node | Window
+ *   }
+ * }
+ * ```
+ *
+ * Note that api-extractor somehow refuses to include `decalre module`
+ * augmentations in its generated d.ts, so we have to manually append them
+ * to the final generated d.ts in our build process.
+ */
+export interface RefUnwrapBailTypes {}
 
 export type UnwrapRef<T> = T extends ComputedRef<infer V>
   ? UnwrapRefSimple<V>
   : T extends Ref<infer V> ? UnwrapRefSimple<V> : UnwrapRefSimple<T>
 
-type UnwrapRefSimple<T> = T extends Function | CollectionTypes | BaseTypes | Ref
+type UnwrapRefSimple<T> = T extends
+  | Function
+  | CollectionTypes
+  | BaseTypes
+  | Ref
+  | RefUnwrapBailTypes[keyof RefUnwrapBailTypes]
   ? T
   : T extends Array<any> ? T : T extends object ? UnwrappedObject<T> : T
 

diff --git a/packages/runtime-core/src/index.ts b/packages/runtime-core/src/index.ts
index a7049f17af7f4825c7c8757a866ef801add3a065..96822e84589bbdb260ef0fab8dfd631f4da8c1ee 100644 (file)
--- a/packages/runtime-core/src/index.ts
+++ b/packages/runtime-core/src/index.ts
@@ -87,6 +87,23 @@ export {
 
 // Types -----------------------------------------------------------------------
 
+import { VNode } from './vnode'
+import { ComponentInternalInstance } from './component'
+
+// Augment Ref unwrap bail types.
+// Note: if updating this, also update `types/refBail.d.ts`.
+declare module '@vue/reactivity' {
+  export interface RefUnwrapBailTypes {
+    runtimeCoreBailTypes:
+      | VNode
+      | {
+          // directly bailing on ComponentPublicInstance results in recursion
+          // so we use this as a bail hint
+          $: ComponentInternalInstance
+        }
+  }
+}
+
 export {
   ReactiveEffect,
   ReactiveEffectOptions,

diff --git a/packages/runtime-core/types/refBail.d.ts b/packages/runtime-core/types/refBail.d.ts
new file mode 100644 (file)
index 0000000..c7ab63d
--- /dev/null
+++ b/packages/runtime-core/types/refBail.d.ts
@@ -0,0 +1,14 @@
+// Note: this file is auto concatenated to the end of the bundled d.ts during
+// build.
+
+declare module '@vue/reactivity' {
+  export interface RefUnwrapBailTypes {
+    runtimeCoreBailTypes:
+      | VNode
+      | {
+          // directly bailing on ComponentPublicInstance results in recursion
+          // so we use this as a bail hint
+          $: ComponentInternalInstance
+        }
+  }
+}

diff --git a/packages/runtime-dom/package.json b/packages/runtime-dom/package.json
index b715e076da062ab8f869722dac6daedc7b3aa543..3963f083a3388f3eaf2964e944ebcbe48690c8ff 100644 (file)
--- a/packages/runtime-dom/package.json
+++ b/packages/runtime-dom/package.json
@@ -18,9 +18,6 @@
       "esm-browser",
       "cjs",
       "global"
-    ],
-    "dts": [
-      "jsx.d.ts"
     ]
   },
   "repository": {

diff --git a/packages/runtime-dom/src/index.ts b/packages/runtime-dom/src/index.ts
index 03de7f70777deb1c362bd26bbfa5aaadbd0f9d13..693e7dbf87dddd4e6d682fc17642442ba299d309 100644 (file)
--- a/packages/runtime-dom/src/index.ts
+++ b/packages/runtime-dom/src/index.ts
@@ -14,6 +14,13 @@ import { patchProp } from './patchProp'
 // Importing from the compiler, will be tree-shaken in prod
 import { isFunction, isString, isHTMLTag, isSVGTag } from '@vue/shared'
 
+declare module '@vue/reactivity' {
+  export interface RefUnwrapBailTypes {
+    // Note: if updating this, also update `types/refBail.d.ts`.
+    runtimeDOMBailTypes: Node | Window
+  }
+}
+
 const rendererOptions = {
   patchProp,
   ...nodeOps

diff --git a/packages/runtime-dom/jsx.d.ts b/packages/runtime-dom/types/jsx.d.ts
similarity index 99%
rename from packages/runtime-dom/jsx.d.ts
rename to packages/runtime-dom/types/jsx.d.ts
index 8748c4f661f1e056776ca981b004a5cad50e9bea..8e7ed1cd968785da9ff4a1c3d556908e50e4631b 100644 (file)
--- a/packages/runtime-dom/jsx.d.ts
+++ b/packages/runtime-dom/types/jsx.d.ts
@@ -1,3 +1,6 @@
+// Note: this file is auto concatenated to the end of the bundled d.ts during
+// build.
+
 import { Ref, ComponentPublicInstance } from '@vue/runtime-core'
 
 // This code is based on react definition in DefinitelyTyped published under the MIT license.

diff --git a/packages/runtime-dom/types/refBail.d.ts b/packages/runtime-dom/types/refBail.d.ts
new file mode 100644 (file)
index 0000000..549b0ec
--- /dev/null
+++ b/packages/runtime-dom/types/refBail.d.ts
@@ -0,0 +1,8 @@
+// Note: this file is auto concatenated to the end of the bundled d.ts during
+// build.
+
+declare module '@vue/reactivity' {
+  export interface RefUnwrapBailTypes {
+    runtimeDOMBailTypes: Node | Window
+  }
+}

diff --git a/scripts/build.js b/scripts/build.js
index 3550f1371f1d2f8a17984dbbba35ada7ac0f1e54..32d091eee5e8a20f1a1c16fd902ad54c653cd412 100644 (file)
--- a/scripts/build.js
+++ b/scripts/build.js
@@ -107,13 +107,15 @@ async function build(target) {
     })
 
     if (extractorResult.succeeded) {
-      // concat additional d.ts to rolled-up dts (mostly for JSX)
-      if (pkg.buildOptions && pkg.buildOptions.dts) {
+      // concat additional d.ts to rolled-up dts
+      const typesDir = path.resolve(pkgDir, 'types')
+      if (await fs.exists(typesDir)) {
         const dtsPath = path.resolve(pkgDir, pkg.types)
         const existing = await fs.readFile(dtsPath, 'utf-8')
+        const typeFiles = await fs.readdir(typesDir)
         const toAdd = await Promise.all(
-          pkg.buildOptions.dts.map(file => {
-            return fs.readFile(path.resolve(pkgDir, file), 'utf-8')
+          typeFiles.map(file => {
+            return fs.readFile(path.resolve(typesDir, file), 'utf-8')
           })
         )
         await fs.writeFile(dtsPath, existing + '\n' + toAdd.join('\n'))

diff --git a/tsconfig.json b/tsconfig.json
index ade912a11a8b78d2ecdb86e32091fab95eb47467..42a85205dce48dfd58c4f86ae7dbe9cb26a4c513 100644 (file)
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -19,13 +19,14 @@
     "rootDir": ".",
     "paths": {
       "@vue/*": ["packages/*/src"],
-      "vue": ["packages/vue/src"]
+      "vue": ["packages/vue/src"],
+      "@vue/reavitity": ["packages/reactivity/src/index.ts"]
     }
   },
   "include": [
     "packages/global.d.ts",
-    "packages/runtime-dom/jsx.d.ts",
     "packages/*/src",
+    "packages/runtime-dom/types/jsx.d.ts",
     "packages/*/__tests__",
     "test-dts"
   ]