fix(types): fix ComponentCustomProps augmentation (#9468)

close #8376

diff --git a/packages/dts-built-test/README.md b/packages/dts-built-test/README.md
new file mode 100644 (file)
index 0000000..8191d66
--- /dev/null
+++ b/packages/dts-built-test/README.md
@@ -0,0 +1,5 @@
+# dts built-package test
+
+This package is private and for testing only. It is used to verify edge cases for external libraries that build their types using Vue core types - e.g. Vuetify as in [#8376](https://github.com/vuejs/core/issues/8376).
+
+When running the `build-dts` task, this package's types are built alongside other packages. Then, during `test-dts-only` it is imported and used in [`packages/dts-test/built.test-d.ts`](https://github.com/vuejs/core/blob/main/packages/dts-test/built.test-d.ts) to verify that the built types work correctly.

diff --git a/packages/dts-built-test/package.json b/packages/dts-built-test/package.json
new file mode 100644 (file)
index 0000000..bde52fd
--- /dev/null
+++ b/packages/dts-built-test/package.json
@@ -0,0 +1,11 @@
+{
+  "name": "@vue/dts-built-test",
+  "private": true,
+  "types": "dist/dts-built-test.d.ts",
+  "dependencies": {
+    "@vue/shared": "workspace:*",
+    "@vue/reactivity": "workspace:*",
+    "vue": "workspace:*"
+  },
+  "version": "3.3.6"
+}

diff --git a/packages/dts-built-test/src/index.ts b/packages/dts-built-test/src/index.ts
new file mode 100644 (file)
index 0000000..2d9d403
--- /dev/null
+++ b/packages/dts-built-test/src/index.ts
@@ -0,0 +1,12 @@
+import { defineComponent } from 'vue'
+
+const _CustomPropsNotErased = defineComponent({
+  props: {},
+  setup() {}
+})
+
+// #8376
+export const CustomPropsNotErased =
+  _CustomPropsNotErased as typeof _CustomPropsNotErased & {
+    foo: string
+  }

diff --git a/packages/dts-test/built.test-d.ts b/packages/dts-test/built.test-d.ts
new file mode 100644 (file)
index 0000000..8ac3e33
--- /dev/null
+++ b/packages/dts-test/built.test-d.ts
@@ -0,0 +1,13 @@
+import { CustomPropsNotErased } from '@vue/dts-built-test'
+import { expectType, describe } from './utils'
+
+declare module 'vue' {
+  interface ComponentCustomProps {
+    custom?: number
+  }
+}
+
+// #8376 - custom props should not be erased
+describe('Custom Props not erased', () => {
+  expectType<number | undefined>(new CustomPropsNotErased().$props.custom)
+})

diff --git a/packages/dts-test/package.json b/packages/dts-test/package.json
index da8424e254ca62616bd30f4b881f8bc1c741acc4..c787e620df2f6b8a2e93febf3b1e387975465fb7 100644 (file)
--- a/packages/dts-test/package.json
+++ b/packages/dts-test/package.json
@@ -2,7 +2,8 @@
   "name": "dts-test",
   "private": true,
   "dependencies": {
-    "vue": "workspace:*"
+    "vue": "workspace:*",
+    "@vue/dts-built-test": "workspace:*"
   },
   "version": "3.3.6"
 }

diff --git a/packages/runtime-core/src/componentPublicInstance.ts b/packages/runtime-core/src/componentPublicInstance.ts
index dc575aafff92b6a2d629d40825c8653fc061420a..b7ef1e07302d6c55a49ab6adba55302d27515992 100644 (file)
--- a/packages/runtime-core/src/componentPublicInstance.ts
+++ b/packages/runtime-core/src/componentPublicInstance.ts
@@ -206,11 +206,9 @@ export type ComponentPublicInstance<
 > = {
   $: ComponentInternalInstance
   $data: D
-  $props: Prettify<
-    MakeDefaultsOptional extends true
-      ? Partial<Defaults> & Omit<P & PublicProps, keyof Defaults>
-      : P & PublicProps
-  >
+  $props: MakeDefaultsOptional extends true
+    ? Partial<Defaults> & Omit<Prettify<P> & PublicProps, keyof Defaults>
+    : Prettify<P> & PublicProps
   $attrs: Data
   $refs: Data
   $slots: UnwrapSlotsType<S>

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 1fd85d6d9062e379faf3f30e585665783a3bb321..a0fec04e513564ec4c26c94478d4cee4400f7fd0 100644 (file)
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -257,8 +257,23 @@ importers:
         specifier: 3.3.6
         version: link:../shared
 
+  packages/dts-built-test:
+    dependencies:
+      '@vue/reactivity':
+        specifier: workspace:*
+        version: link:../reactivity
+      '@vue/shared':
+        specifier: workspace:*
+        version: link:../shared
+      vue:
+        specifier: workspace:*
+        version: link:../vue
+
   packages/dts-test:
     dependencies:
+      '@vue/dts-built-test':
+        specifier: workspace:*
+        version: link:../dts-built-test
       vue:
         specifier: workspace:*
         version: link:../vue